Node.js - экспресс - джейд - скомпилировать SASS / LESS - PullRequest
Новая
       13

Node.js - экспресс - джейд - скомпилировать SASS / LESS

11 голосов
/ 03 декабря 2010

У кого-нибудь есть действительно руководство для новичков по nodejs - экспресс - SASS / LESS?Я не смог заставить это работать.Пример, который у меня сейчас есть, - это как можно более чистый. 

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

Файл style.css.less находится в pub_dir, я могу получить к нему прямой доступ, и стиль: 

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

Насколько я понимаю, компиляция должна происходить при запуске, и в директории src будет сгенерирован файл css, поскольку dest не указан.
Мой сервер работает нормально, но независимоиз-за того, сколько способов я пытался возиться с каталогами, каталогами и именами файлов LESS / SASS (и их соответствующим контентом LESS / SASS), я не могу заставить это работать.Штопать!Помощь.

Ответы [ 5 ]

13 голосов
/ 03 января 2011

Я тоже новичок, пытающийся получить эту настройку.Я пробовал несколько фрагментов, которые нашел, пока, наконец, не заметил, что в экспрессе есть команда 'express', которая устанавливает новый проект.

Попробуйте express -c less создать пример проекта с LESS в качестве движка CSS.1004 *

Это должно создать необходимые каталоги.Новые CSS-файлы будут обслуживаться из вашего статического каталога.

Конфигурация: 

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'));
});
2 голосов
/ 12 июля 2012

Ваша установка является стандартной настройкой для readymade . Убедитесь, что в вашей системе установлено меньше компилятора.

npm install lessjs readymade

А затем добавьте следующее к вашему server.js

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

1 голос
/ 10 февраля 2011

Вот похожий вопрос: Node.js + Express.js. Как РЕНДЕР меньше css?

Вы также можете ознакомиться с руководством на веб-сайте ExpressJS

0 голосов
/ 08 августа 2014

Я работаю над Express 4.x и использую SASS.Вот фрагмент кода, который я использую для стилей (обратите внимание на комментарии): 

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

Вот суть этого: http://git.io/Vr9KJA

0 голосов
/ 18 августа 2011

Два проекта, которые могли бы сделать вашу жизнь прощеСлияние | Проверка)

DocPad: поставщик препроцессора и уполномоченный шаблон для приложений Express.js

...