Express-js ne peut PAS OBTENIR mes fichiers statiques, pourquoi?

J'ai réduit mon code à l'application express-js la plus simple que j'ai pu créer:

var express = require("express"),
    app = express.createServer();
app.use(express.static(__dirname + '/styles'));
app.listen(3001);

Mon répertoire ressemble à ceci:

static_file.js
/styles
  default.css

Pourtant, lorsque j'accède, http://localhost:3001/styles/default.cssj'obtiens l'erreur suivante:

Cannot GET / styles /
default.css

J'utilise express 2.3.3et node 0.4.7. Qu'est-ce que je fais mal?

Essayez http://localhost:3001/default.css.

Pour avoir /stylesdans votre URL de demande, utilisez:

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

Regardez les exemples sur cette page :

//Serve static content for the app from the "public" directory in the application directory.

    // GET /style.css etc
    app.use(express.static(__dirname + '/public'));

// Mount the middleware at "/static" to serve static content only when their request path is prefixed with "/static".

    // GET /static/style.css etc.
    app.use('/static', express.static(__dirname + '/public'));

J'ai le même problème. J'ai résolu le problème avec le code suivant:

app.use('/img',express.static(path.join(__dirname, 'public/images')));
app.use('/js',express.static(path.join(__dirname, 'public/javascripts')));
app.use('/css',express.static(path.join(__dirname, 'public/stylesheets')));

Exemple de requête statique:

http://pruebaexpress.lite.c9.io/js/socket.io.js

J'ai besoin d'une solution plus simple. Existe-t-il?

default.css devrait être disponible à http://localhost:3001/default.css

Le stylesin app.use(express.static(__dirname + '/styles'));indique simplement à express de rechercher dans le stylesrépertoire un fichier statique à servir. Il ne fait pas (confusément) partie du chemin sur lequel il est disponible.

Ce travail pour moi:

app.use('*/css',express.static('public/css'));
app.use('*/js',express.static('public/js'));
app.use('*/images',express.static('public/images'));

Dans votre server.js:

var express   =     require("express");
var app       =     express();
app.use(express.static(__dirname + '/public'));

Vous avez déclaré express et app séparément, créez un dossier nommé «public» ou comme vous le souhaitez, et pourtant vous pouvez accéder à ces dossiers. Dans votre modèle src, vous avez ajouté le chemin relatif de / public (ou le nom de votre dossier destiné aux fichiers statiques). Méfiez-vous des bars sur les itinéraires.

Ce qui a fonctionné pour moi, c'est:

Au lieu d'écrire app.use(express.static(__dirname + 'public/images'));dans votre app.js

Ecrivez simplement app.use(express.static('public/images'));

c'est-à-dire supprimer le nom du répertoire racine dans le chemin. Et puis vous pouvez utiliser efficacement le chemin statique dans d'autres fichiers js, par exemple:

<img src="/images/misc/background.jpg">

J'espère que cela t'aides :)

J'utilise Bootstrap CSS, JS et Fonts dans mon application. J'ai créé un dossier appelé assetdans le répertoire racine de l'application et je place tous ces dossiers à l'intérieur. Puis dans le fichier serveur ajouté la ligne suivante:

app.use("/asset",express.static("asset"));

Cette ligne me permet de charger les fichiers qui se trouvent dans le assetrépertoire à partir du /assetpréfixe de chemin comme: http://localhost:3000/asset/css/bootstrap.min.css.

Maintenant, dans les vues, je peux simplement inclure CSS et JS comme ci-dessous:

<link href="/asset/css/bootstrap.min.css" rel="stylesheet">

pour servir des fichiers statiques (css, images, fichiers js) en deux étapes seulement:

1. passer le répertoire des fichiers css au middleware express.static intégré

   var express = require('express');
   var app = express();
   /*public is folder in my project directory contains three folders
   css,image,js
   */
   //css  =>folder contains css file
   //image=>folder contains images
   //js   =>folder contains javascript files
   app.use(express.static( 'public/css'));

2. pour accéder aux fichiers ou images css, il suffit de taper l'URL http: // localhost: port / filename.css ex: http: // localhost: 8081 / bootstrap.css

note: pour lier des fichiers css à html, il suffit de taper<link href="file_name.css" rel="stylesheet">

si j'écris ce code

var express = require('express');
var app = express();
app.use('/css',express.static( 'public/css'));

pour accéder aux fichiers statiques, tapez simplement url: localhost: port / css / filename.css ex: http: // localhost: 8081 / css / bootstrap.css

note pour lier des fichiers css avec html il suffit d'ajouter la ligne suivante

<link href="css/file_name.css" rel="stylesheet">    

celui-ci a fonctionné pour moi

app.use(express.static(path.join(__dirname, 'public')));

app.use('/img',express.static(path.join(__dirname, 'public/images')));

app.use('/shopping-cart/javascripts',express.static(path.join(__dirname, 'public/javascripts')));

app.use('/shopping-cart/stylesheets',express.static(path.join(__dirname, 'public/stylesheets')));

app.use('/user/stylesheets',express.static(path.join(__dirname, 'public/stylesheets')));

app.use('/user/javascripts',express.static(path.join(__dirname, 'public/javascripts')));

Essayez d'y accéder avec http: // localhost: 3001 / default.css .

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

Vous lui donnez en fait le nom du dossier, c'est-à-dire les styles et non votre sous-URL.

Je trouve mon fichier css et j'y ajoute un itinéraire:

app.get('/css/MyCSS.css', function(req, res){
  res.sendFile(__dirname + '/public/css/MyCSS.css');
});

Ensuite, cela semble fonctionner.

En plus de ce qui précède, assurez-vous que le chemin du fichier statique commence par / (ex ... / assets / css) ... pour servir les fichiers statiques dans n'importe quel répertoire au-dessus du répertoire principal (/ main)

si votre configuration

myApp
  |
  |__ public
  |     |
  |     |__  stylesheets
  |     |     |
  |     |     |__ style.css
  |     |
  |     |___ img
  |           |
  |           |__ logo.png
  |
  |__ app.js

puis
mettez app.js

app.use('/static', express.static('public'));

et référez-vous à votre style.css: (dans certains fichiers .pug):

link(rel='stylesheet', href='/static/stylesheets/style.css')

1. Créez un dossier avec un nom «public» dans le
   dossier du projet Nodejs .
2. Placez le fichier index.html dans le dossier du projet Nodejs.
3. Mettez tous les scripts et fichiers css dans un dossier public.

4. Utilisation app.use( express.static('public'));

5. et dans le index.html bon chemin des scripts pour<script type="text/javascript" src="/javasrc/example.js"></script>

Et maintenant, tout fonctionne bien.

répertoire statique

vérifier l'image ci-dessus (répertoire statique) pour la structure de dir

const publicDirectoryPath = path.join(__dirname,'../public')
app.use(express.static(publicDirectoryPath))


//  or

app.use("/", express.static(publicDirectoryPath))
app.use((req, res, next) => {
res.sendFile(path.join(publicDirectoryPath,'index.html'))