In LESS CSS can I get LESS to watch a bunch of files but compile a different file when they change?

Question

I have several LESS files that are all imported into one master file (styles.less). My problem at the moment is: when I make a change in one of the child files I have to save style.less to compile it to CSS.

Is there a way in which I can ask less to monitor the child files but only compile the parent?

Cheers, Ad

Answer 1

I found a solution for MY problem but it would be great for most.

As I am on a Mac I istalled less.app ( http://incident57.com/less/ ), it uses less.js to compile the less for you. As of a couple of days ago they added a new feature:

NEW FEATURE: "backwards @import parsing." If you have a file, X, that imports another file, Y, and you make changes to Y, X will now automatically recompile when you save Y (if auto-compile is on). This feature is automatic; there's nothing to turn on or hook up. You'll see "triggered by: X" in the compiler result when it happens.

Turns out it works very well indeed. Hope this helps someone!

Answer 2

I've hacked a bash script called lesswatch (it doesn't support "backwards @import parsing") that uses watchdog to listen for file change events and lessc to compile to CSS. I wrote a short blog post about this today.

Answer 3

There's a fork of less.js that watches file changes and even all files included via @import (like the accepted answer above):

https://github.com/wvl/less.js

The author of less.js does not want the --watch option of the old ruby version, so this fork may be your best option for now. Through node.js it can run on all platforms.

Answer 4

You can use this nodejs script and do the same thing.

node less-watch-compiler.js FOLDER_TO_WATCH FOLDER_TO_OUTPUT

https://github.com/jonycheung/Dead-Simple-LESS-Watch-Compiler

It skips watching files with names that starts with underscore or a period.

Answer 5

If you use Mac, I currently use less.app from Code Kit http://incident57.com/less/

It works really well.