我希望使用Webpack将/less
中所有较少的文件编译为/public/css
,并将它们作为常规css包含在我们的服务器端模板中(不坚持文本进入使用ExtractText插件或重载需要)。
也就是说,我正在尝试将Webpack +一个LESS加载器或插件添加到glob来编译所有.less文件:
/less/foo.less /less/bar.less /less/unknown-new-less-file.less ...
并将它们输出到
/public/css/foo.less /public/css/bar.less /less/unkown-new-less-file.less
然后我想通过使用css文件将它们包含在我们的应用程序中
<link rel="stylesheet" href="foo.css">
我尝试使用Bash脚本和lessc
而不是Webpack,它运行良好,但是当源文件发生变化时,我们无法自动重新编译LESS。
答案 0 :(得分:0)
您可以将chokidar
与lessc
一起使用,而不是使用webpack。
首先,安装chokidar:npm install chokidar-cli
然后,用它来观察你的文件:
chokidar "less/*.less" -c "lessc less/foo.less public/css/foo.css"
Chokidar documentation on GitHub
有关为何不使用webpack进行单独编译的更多信息:Can I use webpack to generate CSS and JS separately?
答案 1 :(得分:0)
问题是我使用Webpack作为任务运行器,但事实并非如此。
我拒绝添加Gulp或Make。 Gulp,因为它变成了一个巨大的无法维护的混乱,尽管它很棒,因为它对团队学习有点困难。
我最终在npm脚本中使用类似fswatch的东西来重新运行lessc。
Less文档建议使用grunt,Gulp或dev-mode浏览器内解析:http://lesscss.org/usage/#using-less-in-the-browser-watch-mode。