Twitter Bootstrap LESS with Node.js & Express

三世轮回 提交于 2019-11-29 22:52:54
GoldenBoy

For posterity, this has changed a lot in recent Express:

app.use(require('less-middleware')({ src: __dirname + '/public' }));
app.use(express.static(path.join(__dirname, 'public')));

// This is just boilerplate you should already have
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);

Ok, here is what I have found for you. First you need both the compiler and the static middleware. The compiler compiles your less and recompiles on changes, the static middleware does the actual serving of the css

app.use(express.compiler({ src : __dirname + '/public', enable: ['less']}));  
app.use(express.static(__dirname + '/public'));

Second, for some reason when the compiler runs it is losing the current path information, so it can't find the includes. So I had to go through the bootstrap.css and add the path to each import.

@import "/public/stylesheets/reset.less";

This is clearly odd, I am going to dig into it further.

Edit: While odd, a deep look through the code shows me no simple way around it. A bit more searching found this pull request on the connect repo https://github.com/senchalabs/connect/pull/174 which offers a fix for this, but the devs don't seem to want it.

There are also some workarounds in that thread, but it seems the best idea is to absolute path your includes.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!