app.js:
app.use(express.compiler({ src: __dirname + '/public', enable: ['less']}));
app.use(express.static(__dirname + '/public'));
在我的玉视图中:
link(rel="stylesheet", type="text/css", href='/app/stylesheets/app.less)
我收到的文件较少: 公共/应用/样式表/ app.less
当我请求页面时,我已经进入了html head:
<link href="/app/stylesheets/app.less" type="text/css" rel="stylesheet">
并在服务器控制台中注明。
1)那么为什么表达甚至没有尝试编译app.less?应该吗?
2)如果一切正确:应该链接到htm
<link href="/app/stylesheets/**app.less**" ... >
或express应该在渲染时更改文件的扩展名吗?
<link href="/app/stylesheets/**app.css**" ... >
答案 0 :(得分:12)
https://github.com/visionmedia/express/issues/877
更新2013-01-16
从Express 3.0.0开始,框架现在包含less-middleware
,而不是以前在Connect中的compiler
中间件。它的工作方式与旧的中间件非常相似。
要将其添加到现有项目,请将less-middleware
添加到package.json
并运行npm install
,然后将以下内容添加到您的配置中:
app.use(require('less-middleware')({ src: __dirname + '/public' }));
app.use(express.static(path.join(__dirname, 'public')));
在您的Jade模板中,您将其引用为普通的CSS文件:
link(rel='stylesheet', type='text/css', href='css/styles.css')
您的目录结构如下所示:
myapp
+-public
+-css
+-styles.less
less-middleware
将查找与请求的.css文件同名的.less文件。如果它找到一个,它将编译它并服务于生成的CSS。
您可能希望从源代码管理中排除已编译的CSS文件。如果您使用的是Git,则可以将.css
添加到.gitignore
文件中。
答案 1 :(得分:5)
您可以通过中间件进行LESS编译,就像Stylus
目前的工作方式一样。
编辑:而不是尝试将[pull request] [0]放入主LESS存储库,而是决定将其作为单独的包进行。 < / p>
的使用方法var lessMiddleware = require('less-middleware');
var app = express.createServer();
app.configure(function () {
// Other configuration here...
app.use(lessMiddleware({
src: __dirname + '/public',
compress: true
}));
app.use(express.static(__dirname + '/public'));
});
在您的jade文件中,您应该能够使用对css文件的引用:
link(rel="stylesheet", type='text/css', href='/app/stylesheets/app.css')