template - Twitter Bootstrap LESS con Node.js y Express

handlebars tutorial

Question

Dado que Twitter Bootstrap 2 está disponible, quería integrarlo en mi proyecto Node.js. Desafortunadamente, hay algo mal con el compilador menos y no puedo hacer que funcione. Puse todos los archivos en la carpeta pública y configuré un nuevo proyecto con express -c less newproj . Y agregó las líneas por menos.

less = require(''less'');
app.use(express.compiler({ src: __dirname + ''/public'', enable: [''less''] }));

Todo lo que me dice Nodo es:

Express server listening on port 3000 in development mode
undefined

En el lado del cliente, obtengo un 500 (Error interno del servidor) para el archivo bootstrap.css, que debería compilar con lessc.

lessc bootstrap.less

Funciona bien.

¿Alguien sabe como resolver el problema?

Answer 1

Ok, esto es lo que he encontrado para ti. Primero necesitas tanto el compilador como el middleware estático. El compilador compila menos y compila los cambios, el middleware estático realiza el servicio real del css.

app.use(express.compiler({ src : __dirname + ''/public'', enable: [''less'']}));  
app.use(express.static(__dirname + ''/public''));

En segundo lugar, por alguna razón, cuando el compilador se ejecuta, está perdiendo la información de la ruta actual, por lo que no puede encontrar la inclusión. Así que tuve que ir a través de bootstrap.css y agregar la ruta a cada importación.

@import "/public/stylesheets/reset.less";

Esto es claramente extraño, voy a profundizar en ello.

Edición: aunque parezca extraño, una mirada profunda a través del código no me muestra una manera simple de evitarlo. Un poco más de búsqueda encontró esta solicitud de extracción en el repositorio de conexión https://github.com/senchalabs/connect/pull/174 que ofrece una solución para esto, pero los desarrolladores no parecen quererlo.

También hay algunas soluciones en ese hilo, pero parece que la mejor idea es la ruta absoluta que incluye.

Answer 2

Para la posteridad, esto ha cambiado mucho en el reciente Express:

app.use(require(''less-middleware'')({ src: __dirname + ''/public'' }));
app.use(express.static(path.join(__dirname, ''public'')));

// This is just boilerplate you should already have
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);