Question

我正在尝试使用Less with Express.js但是我不确定我的设置是否正确。

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

....
app.js
公共
- 样式
  - test.less
........

在我的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个文件并动态编译。

如何使用Less with Express.js？

3 个答案: