如何在Express.js中使用Less？

Question

我试图将Less与Express.js结合使用，但是我不确定我的设置是否正确。

我的文件夹/文件结构如下：

• ....
• app.js
• 上市
  • 样式
    • 无测试
• ........

在我的app.js ：

var express = require('./node_modules/express');
var lessMiddleware = require('./node_modules/less-middleware');
var app = express();

app.set('view engine', 'ejs'); 
app.set("views", "./views");

app.get('/', function(req, res, next) 
{
    res.render('index.ejs');
});

app.use(lessMiddleware(__dirname + "/public/styles"));

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

app.listen(3000);

在我的index.ejs ：

<link rel="stylesheet" type="text/css" href="/public/styles/test.css">

如果我理解正确，则该模块应该接受我的test.less并将其编译为test.css然后再提供给客户端使用？

我究竟做错了什么 ？

更新：看起来/ public没有提供任何服务。

http://localhost:3000/public返回Cannot GET /public

Answer 1

您使用/ public / less而不是/ public / styles，并且需要将该目录作为静态目录提供：

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

然后创建链接href /styles/test.css。

编辑：

您需要在定义任何路由之前将较少的中间件和静态中间件移到顶部。

Answer 2

我的意思是您需要安装此软件包： https : //www.npmjs.com/package/express-less

Answer 3

简单的通过运行安装较少的中间件npm install --save less-middleware ，这行添加到您的app.js文件：

app.use(require('less-middleware')(path.join(__dirname, 'public')));

它会检查所有.less和编译文件的飞行。