Question

我正在尝试找到一个很好的解决方案来观看单个LESS文件，其中包含一堆导入更改（包括导入文件中的更改，但只编译主文件）。

我将LESS分成不同的文件作为“模块”，以使其更易于管理，主要的LESS文件只是一堆导入。但是，我已经查找了每个解决方案来查看更改而不必每次都手动编译，或者编译目录中的每个LESS文件，或者无法识别导入文件中的更改。

所以我正在寻找一种能够观察所有LESS文件变化的解决方案，但是如果发生变化，只会编译主LESS文件。如果有人之前做过这样的事情，那对我有很大的帮助，而不是从头开始制作东西。

更新我找到了https://github.com/jonycheung/Dead-Simple-LESS-Watch-Compiler。默认情况下，它会检查并编译目录中的每个较少的文件。很容易修改以查看所有较少的文件，并在检测到更改时仅编译主文件。

Answer 1

LESS 1.3.1有一个名为@import-once的新功能。而不是@import，请使用@import-once。

没有详细记录，但这里是changelog和issue, discussion, more

Answer 2

我不知道你是否在使用Coffeescript，但由于Less依赖于Node，你已经安装了它。我创建了以下Cakefile，它应该很容易转换为普通的javascript文件。修改多个文件也应该很容易。

option '-c', '--lessFile [main Less Filename]', 'The single file to be compiled into the stylesheet, it should import any files it needs'

task 'watch-less', 'Compile Less scripts on the fly during Development', (opts) ->
  less = options.less

  watchers = []

  compile = () ->
    w.close() for w in watchers
    exec "lessc #{less} #{less.replace /\.less$/, ".css"}"
    watch()

  watch = () ->
    exec "lessc -M #{less} -", (err, stdout, stderr) ->
      throw new Error err if err
      watchers = (fs.watch(f, compile) for f in stdout.trim().split(' ').splice(1))

  compile()

通知和免责声明：

除了少之外没有外部依赖。
注意fs.watch，而不是跨平台

观看具有多个导入的LESS文件，仅编译单个文件

2 个答案: