Estoy en las primeras etapas de la configuración de una aplicación Node.js/Express (un área en la que soy bastante verde) y estoy tratando de integrar SASS para manejar el estilo. Estoy usando el paquete node-sass-middleware y puedo hacer que SASS se renderice en CSS y se muestre, pero solo una vez después de reiniciar el servidor. Todas las solicitudes posteriores no están sirviendo el CSS correcto. El archivo .css está allí en las solicitudes posteriores, pero está vacío. De todos modos, esto es lo que tengo en mi archivo server.js:
const express = require('express'); const app = express(); const sassMiddleware = require('node-sass-middleware'); const path = require('path') app.set('views', __dirname + '/views'); app.use(sassMiddleware({ src: path.join(__dirname, "/sass"), dest: path.join(__dirname, "/public/stylesheets"), debug: true, outputStyle: 'compressed' }), express.static(path.join(__dirname, 'public')) );Y una página de índice estática básica que estoy usando:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>SkyCast</title> <link rel="stylesheet" type="text/css" href="/style.css"> </head> <body> <h1>Hello world!</h1> </body> </html>Cuando miro en el archivo style.css compilado en el servidor, el css correcto está allí, pero el cliente no lo está tomando. Esto se ejecuta localmente usando Nodemon. Cualquier ayuda es muy apreciada.
Y después de golpearme la cabeza contra esto encontré una respuesta. Parece que la llamada a express.static solo funciona correctamente si está incluida en la llamada original a app.use. Configurándolo así:
app.use(sassMiddleware({ src: path.join(__dirname, 'scss'), dest: path.join(__dirname, 'public'), debug: true, outputStyle: 'compressed' }), express.static(path.join(__dirname, 'public')));Hizo el truco.