In Less CSS How to Get Less to Watch a Bunch of Files But Compile a Different File When They Change

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

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!

automatically compile less file on save of a imported less file

In all honesty, your best bet is to actually use Less's own compiler which will of course be the most up to date option. It will be done through command line but it's the best way to know that everything is correct, working and up-to-date.

All the information can be found in the Less Documentation Here

More information about compiling with imports can be found HERE

The latest version of WinLESS does report that it has automatic re-compiling when an @import file is changed so it could be that your version of WinLESS is out of date. (See HERE - 3rd bullet point under Features)

Alternatively, see if you can get it to work on purely local files. If this works, it may be an issue with the compiler not being able to do asynchronous checks over SSH.

How do I compile LESS files every time I save a document?

The best solution out there I've found is the one recommended on the official LESS website: https://github.com/jgonera/autoless. It is dead simple to use. Also it listens to the changes in the imported files to compile.

How do I compile LESS files every time I save a document?

The best solution out there I've found is the one recommended on the official LESS website: https://github.com/jgonera/autoless. It is dead simple to use. Also it listens to the changes in the imported files to compile.

How to recompile css after changing less

You can use watch mode, or something like gulp or grunt (see links). They're task runners that will be able to watch your file tree and run tasks based on different changes. Both are really popular, but they each have a different philosophy/paradigm: grunt is more configuration-over-code, while gulp is more code-over-configuration. It just runs generic node modules and makes great use of the streams implemented in Node to achieve concurrency and more-composable tasks.

To compile Less:

lessc [option option=parameter ...] <source> [destination]

Useful Links:

• http://gulpjs.com/
  
  • https://github.com/gulpjs/gulp/blob/master/docs/getting-started.md
• http://gruntjs.com/
  
  • http://gruntjs.com/getting-started
• http://lesscss.org/usage/#using-less-in-the-browser-watch-mode
• http://lesscss.org/#using-less (general less usage)

---

Related Topics