Express-js no puede OBTENER mis archivos estáticos, ¿por qué?

Reduje mi código a la aplicación express-js más simple que pude hacer:

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

Mi directorio se ve así:

static_file.js
/styles
  default.css

Sin embargo, cuando accedo http://localhost:3001/styles/default.cssme sale el siguiente error:

Cannot GET / styles /
default.css

Estoy usando express 2.3.3y node 0.4.7. ¿Qué estoy haciendo mal?

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

Para tener /stylesen su URL de solicitud, use:

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

Mira los ejemplos en esta página :

//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'));

Tengo el mismo problema. He resuelto el problema con el siguiente código:

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')));

Ejemplo de solicitud estática:

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

Necesito una solución más simple. ¿Existe?

default.css debería estar disponible en http://localhost:3001/default.css

El stylesde app.use(express.static(__dirname + '/styles'));simplemente expresar dice que buscar en el stylesdirectorio para un archivo estático para servir. No lo hace (confusamente) entonces forma parte de la ruta en la que está disponible.

Este trabajo para mi:

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

En su server.js:

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

Has declarado express y app por separado, crea una carpeta llamada 'public' o como quieras, y aún así puedes acceder a esta carpeta. En su plantilla src, ha agregado la ruta relativa desde / public (o el nombre del destino de su carpeta a los archivos estáticos). Cuidado con los bares en las rutas.

Lo que funcionó para mí es:

En lugar de escribir app.use(express.static(__dirname + 'public/images'));en tu app.js

Simplemente escribe app.use(express.static('public/images'));

es decir, elimine el nombre del directorio raíz en la ruta. Y luego puede usar la ruta estática de manera efectiva en otros archivos js, por ejemplo:

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

Espero que esto ayude :)

Estoy usando Bootstrap CSS, JS y Fonts en mi aplicación. Creé una carpeta llamada asseten el directorio raíz de la aplicación y coloco todas estas carpetas dentro de ella. Luego, en el archivo del servidor, agregue la siguiente línea:

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

Esta línea me permite cargar los archivos que están en el assetdirectorio desde el /assetprefijo de ruta como:http://localhost:3000/asset/css/bootstrap.min.css .

Ahora en las vistas simplemente puedo incluir CSS y JS como a continuación:

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

para servir archivos estáticos (css, imágenes, archivos js) solo dos pasos:

1. pasar el directorio de archivos css a middleware express.static integrado

   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. para acceder a archivos css o imágenes simplemente escriba url http: // localhost: port / filename.css ex: http: // localhost: 8081 / bootstrap.css

nota: para vincular archivos CSS a HTML simplemente escriba<link href="file_name.css" rel="stylesheet">

si escribo este código

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

para acceder a los archivos estáticos simplemente escriba url: localhost: port / css / filename.css ej: http: // localhost: 8081 / css / bootstrap.css

Nota para vincular archivos CSS con HTML simplemente agregue la siguiente línea

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

este me funcionó

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')));

Intente acceder con http: // localhost: 3001 / default.css .

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

En realidad, le está dando el nombre de carpeta, es decir, estilos, no su suburl.

Encuentro mi archivo css y le agrego una ruta:

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

Entonces parece funcionar.

Además de lo anterior, asegúrese de que la ruta del archivo estático comience con / (ex ... / assets / css) ... para servir archivos estáticos en cualquier directorio sobre el directorio principal (/ main)

si su configuración

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

luego,
ingrese app.js

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

y consulte su style.css: (en algún archivo .pug):

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

1. Crear una carpeta con nombre 'público' en el proyecto Nodejs
   carpeta del .
2. Coloque el archivo index.html en la carpeta del proyecto Nodejs.
3. Ponga todo el script y el archivo CSS en la carpeta pública.

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

5. y en index.html la ruta correcta de scripts para<script type="text/javascript" src="/javasrc/example.js"></script>

Y ahora todas las cosas funcionan bien.

directorio estático

verifique la imagen anterior (directorio estático) para ver la estructura de directorios

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'))