Node express server ne desservant pas le dossier images

Lorsque je lance mon application React intégrée sur le serveur de production, elle ne trouve pas mes fichiers image et je ne sais pas trop pourquoi. Je suis à peu près certain que cela a quelque chose à voir avec la configuration de mon noeud express et / ou mon fichier de modèle .ejs .

server.js

 var express = require('express') var app = express(); const path = require('path'); app.use('/static', express.static(__dirname + '/static')); app.set('views', __dirname + '/views'); app.set('view engine', 'ejs'); app.get('*', function (req, res) { res.render("index"); }); const port = process.env.PORT || 3000; const env = process.env.NODE_ENV || 'production'; app.listen(port, err => { if (err) { return console.error(err); } console.info(`Server running on http://localhost:${port} [${env}]`); });

index.ejs

      Production Server

Ma feuille de style CSS est appelée dans le fichier de modèle, et tous les fichiers JS sont regroupés dans bundle.js qui est référencé dans la balise de script. Je ne sais pas comment faire pour que mon application reconnaisse le dossier /img , car ce n’est pas le cas pour le moment.

Voici ma structure de fichier:

 - static - css - main.css - js - bundle.js - img (contains all image files)

Cependant, lorsque je lance l’application et que j’ouvre «Sources» dans la console Chrome, le fichier / img n’est pas diffusé.

Je pensais que cette ligne indique que express sert à tout dans le dossier /static …

 app.use('/static', express.static(__dirname + '/static'));

… pourtant, seuls deux fichiers sur trois sont diffusés.

J’apprécierais massivement si quelqu’un peut me dire où je vais mal avec ma configuration.

Merci d’avance.

L’onglet source dans les DevTools affichera uniquement le contenu utilisé par le navigateur dans votre cas index.ejs, il utilise uniquement les fichiers .js et .css

dans Index.ejs que vous chargez

cela signifie donc le middleware app.use('/static', express.static(__dirname + '/static')); vérifiera si oui ou non les /js/bundle.js et /css/main.css sont présents dans le dossier statique, si oui, il les servira, sinon des fichiers ou des dossiers seront introuvables.

Cela signifie que tout ce que vous allez charger à partir du dossier statique dans index.ejs ou dans index.ejs uniquement que le contenu et les fichiers seront présents dans l’onglet source. Essayez d’append une image dans index.ejs à partir d’un dossier statique, puis affichez l’onglet source

ou supprimer et afficher l’onglet source, vous ne verrez pas le dossier JS car il n’a pas été utilisé par index.ejs

Rechargez toujours le serveur