问题 Node.js - express - jade - 编译SASS / LESS


任何人都有  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;
}

据我所知,编译应该在启动时发生,并且将在中生成一个css文件 src-dir,因为未指定dest。
我的服务器运行正常,但无论我尝试使用LESS / SASS文件的dirnames,目录和名称(以及它们各自的LESS / SASS内容)有多少方法,我都无法正常工作。该死!帮帮我。


10692
2017-12-03 10:48


起源

当然...让src目录写可访问... F(*&=) - Gnimm
我仍然没有得到它。 - tofutim


答案:


我也是一个想要获得此设置的新手。我已经尝试了一些我发现的片段,直到我终于注意到express有一个'express'命令来设置一个新项目。

尝试 express -c less 使用LESS作为CSS引擎创建示例项目。

这应该创建所需的目录。新的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'));
});

13
2018-01-03 07:13



是的,它适用于我的sass案例。我使用了以下命令 express myapp -c sass 除了创建具有快速结构的应用程序外,它还为我的应用程序添加了node-sass-middleware设置。 - Faisal Mq


您的设置是标准设置 现成。确保您的系统上安装了较少的编译器。

npm install lessjs readymade

然后将以下内容添加到server.js

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


2
2017-07-11 22:04





这是一个类似的问题: Node.js + Express.js。如何减少css?

你也可以查看指南 ExpressJS网站


1
2018-02-10 00:10





两个可以让您的生活更轻松的项目

  1. 构建器:(Java | Coffee)脚本和(CSS | Less)(Builder | Bundler | Packer | Minifier | Merger | Checker)

  2. DocPad:Express.js应用程序的预处理器提供程序和模板授权者


0
2017-08-17 23:56



第二个链接坏了 - Sam Hasler
@SamHasler对此表示感谢,是的,less4client被弃用而不是DocPad。更新了链接以反映出来。 - balupton


我正在使用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
2017-08-08 13:48