2011-12-14 10 views
5

app.js:express.js menos compilador: no pueden conseguir trabajo

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

En mi punto de vista de jade:

link(rel="stylesheet", type="text/css", href='/app/stylesheets/app.less) 

Tengo menos archivo en: /app/hojas de estilo públicas /app.less

Cuando solicito la página que tengo en la cabeza html:

<link href="/app/stylesheets/app.less" type="text/css" rel="stylesheet"> 

Y anotando en la consola del servidor.

1) Entonces, ¿por qué expresar incluso no intenta compilar app.less? ¿Deberia?

2) Si todo bien: debe vincular en htm ser

<link href="/app/stylesheets/**app.less**" ... > 

o expresar debe cambiar la extensión del archivo, mientras que hacer?

<link href="/app/stylesheets/**app.css**" ... > 

?

Respuesta

12

Parece que el compilador() fue retirado de conexión y no se apoyará más, de acuerdo con TJ Holowaychuck (creador de Conecta & Express):

https://github.com/visionmedia/express/issues/877


Actualización 2013 -01-16

A partir de Express 3.0.0 el marco ahora incluye less-middleware en lugar del compiler middleware tha solía estar en Connect. Funciona de manera muy similar al antiguo middleware.

para agregarlo a un proyecto existente, añadir less-middleware a su package.json y ejecutar npm install continuación, añada lo siguiente a su fichero de configuración:

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

En su plantilla Jade se hace referencia como un archivo CSS normales:

link(rel='stylesheet', type='text/css', href='css/styles.css') 

la estructura de directorios se verá algo como esto:

myapp 
+-public 
    +-css 
    +-styles.less 

less-middleware buscará archivos .less que tengan el mismo nombre que el archivo .css que se solicitó. Si encuentra uno, lo compilará y servidor el CSS resultante.

Probablemente quiera excluir los archivos CSS compilados de su control de origen. Si está usando Git, puede agregar .css a su archivo .gitignore.

+0

Sí, tiene sentido No encontré la fuente del compilador en la fuente. Gracias por señalar. – WHITECOLOR

5

Puede obtener MENOS compilación para trabajar a través de middleware, de la misma manera que Stylus funciona actualmente.

Editar: En lugar de tratar de obtener la [solicitud de extracción] [0] en el repositorio principal MENOS se decidió sólo lo hacen como un paquete separado.

Aquí es cómo se puede utilizar el LESS.js middleware:

var lessMiddleware = require('less-middleware'); 

var app = express.createServer(); 

app.configure(function() { 
    // Other configuration here... 

    app.use(lessMiddleware({ 
     src: __dirname + '/public', 
     compress: true 
    })); 

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

En el archivo de jade a continuación, debería ser capaz de utilizar la referencia al archivo CSS:

link(rel="stylesheet", type='text/css', href='/app/stylesheets/app.css') 
+0

express.staticProvider ya no funciona en Express 3.x –

+0

Gracias, actualizado para usar la sintaxis del controlador estático Express 3.x. – Randy

Cuestiones relacionadas