Node.js - express - jade - compile SASS/LESS

Question

Quelqu'un at-il un vraiment newbie guide to nodejs - express - SASS/LESS? Je n'ai pas réussi à faire fonctionner ça. L'exemple que j'ai maintenant un bareboned possible ..

var express = require('express'), 
    less = require('less'), 
    app = express.createServer(); 

var pub_dir = __dirname + '/public'; 

app.configure(function(){ 
    app.use(express.compiler({ src: pub_dir, enable: ['less'] })); 
    app.use(express.staticProvider(pub_dir)); 
}; 

app.configure('development', function(){ 
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true })); 
}); 

Le fichier style.css.less est situé dans pub_dir, je peux accéder à ce directement, et le style est

@brand_color: #4D926F; 
body { 
    color: @brand_color; 
} 

Pour autant que je comprends, la compilation est supposée avoir lieu au démarrage, et un fichier css sera généré dans le src -dir, car dest n'est pas spécifié.
Mon serveur fonctionne correctement, mais quel que soit le nombre de tentatives que j'ai faites avec les noms de répertoires, répertoires et noms des fichiers LESS/SASS (et leur contenu LESS/SASS respectif), je n'arrive pas à le faire fonctionner. Zut! Aidez-moi.

Answer 1

Je suis également un newb essayant d'obtenir cette installation. J'ai essayé quelques extraits que j'ai trouvés jusqu'à ce que je remarque enfin que express a une commande 'express' qui crée un nouveau projet. Essayez express -c less pour créer un exemple de projet avec LESS comme moteur CSS.

Cela devrait créer les répertoires requis. Les nouveaux fichiers CSS seront servis à partir de votre répertoire statique.

La configuration est:

app.configure(function(){ 
    app.set('views', __dirname + '/views'); 
    app.set('view engine', 'hbs'); 
    app.use(express.bodyDecoder()); 
    app.use(express.methodOverride()); 
    app.use(express.compiler({ src: __dirname + '/public', enable: ['less'] })); 
    app.use(app.router); 
    app.use(express.staticProvider(__dirname + '/public')); 
}); 

Answer 2

Voici une question similaire: Node.js + Express.js. How to RENDER less css?

vous pouvez également consulter le guide sur les ExpressJS Website

Answer 3

Deux projets qui pourraient vous rendre la vie plus facile

1. Buildr: The (Java|Coffee)Script and (CSS|Less) (Builder|Bundler|Packer|Minifier|Merger|Checker)

2. DocPad: Pre-processor provider and template empowerer for Express.js apps

Answer 4

Votre configuration est la configuration standard pour readymade. Assurez-vous que moins de compilateur est installé sur votre système.

npm install lessjs readymade

Et puis ajoutez ce qui suit à vos server.js

app.use(require('readymade').middleware({root: "public"}));

Answer 5

Je travaille sur 4.x express et en utilisant SASS. Voici une partie de bout J'utilise des styles (l'esprit les commentaires):

var express = require('express'), 
    // ... other packages 
    sass = require('node-sass'); 

// ... 
var app = express(); 
// ... 
// Commented this default express generator line: 
// app.use(require('stylus').middleware(path.join(__dirname, 'public'))); 
// 
// Because of some bug the node-sass (http://git.io/eItWzA) does not scan the correct folders, 
// so I have both .scss and final .css in one /public/css/ folder 
app.use(
    sass.middleware({ 
     src: __dirname + '/public/', // where the sass files are 
     dest: __dirname + '/public/', // where css should go 
    }) 
); 

// ... rest of app 

Voici un point essentiel pour elle: http://git.io/Vr9KJA