Skip to content
This repository

Add -w Watch mode to lessc command line tool. Closes cloudhead/less.js#192 #194

wants to merge 1 commit into from

12 participants

Paul Oswald Wayne Larsen Idris Mokhtarzada Alexis Sellier Ricardo Tomasi Josiah Steve Losh yvess Bruce Clark Umair Ashraf Soviut Luke Page
Paul Oswald

As discussed in less/less.js#192

Call this with a command like:

$ lessc -w -x base.less base.css
8 Feb 17:26:10 - Change detected... Updated

One issue is that a parse error will cause the system to exit and you have to relaunch it. I also don't think it will watch imported stylesheets. Perhaps is there a better way to do this?

Wayne Larsen
wvl commented March 28, 2011

Looks good -- you also want to process the file when you first launch. I made that change here:

Also, I pushed a bunch of changes that avoid the process.exit, so you do not have to relaunch the script on errors. I'll add a separate pull request for that change.

Idris Mokhtarzada
idris commented July 12, 2011

Any idea when this will be merged in? Maybe we can get a 1.1.4 release with this functionality?

Idris Mokhtarzada
idris commented July 13, 2011

I've made a lesswatch command that can be used to watch entire directories, rather than just watching one file. It just automatically compiles .less files into their .css counterparts, so you don't have to specify output files.

Try it out and let me know what you think

Alexis Sellier

When developing, you can use watch-mode in the browser, by adding #!watch to the url, I don't want this as part of the command line tool.

Alexis Sellier cloudhead closed this August 22, 2011
Ricardo Tomasi

This is essential to the command-line tool, why wouldn't you want it? It's the most reliable way to use LESS in a development environment and have an exported CSS always ready for deploy.

Paul Oswald

I don't serve out the .less files directly to the browser so intentionally nerfing this feature of the command line tool seems a bit strange to me. I can understand wanting to keep a single way of doing things because it would be simpler but I don't think there would be a lot of confusion around this.

I added this as it was missing when I migrated from the original less project to the less.js project. Some of the styling work I do is with pages loaded into an embedded browser where I can't just append something to the url and we don't run javascript there anyway.


Cloudhead, could you elaborate on why you don't want this in the command line tool? It seems like the perfect place for this kind of functionality.

Steve Losh

I'd also like to know why? I use kicker to get around this on OS X but it makes working on Linux or Windows a pain in the ass.


The watch command is also very important to me. This makes the use cases of lessc a lot more broader.
Everbody who migrates from sass or the less.js ruby version can keep their workflow.

Alexis Sellier

There is a discussion on why here: #246 (comment)

Bruce Clark

As I mentioned in issue #192 — those still looking for a solution to this, I recommend Coyote

Coyote is a tool allowing you to watch source files for Coffescript, SASS, or LESS and then compile them on the fly. Example: coyote -w input.less:output.css

Umair Ashraf

Please add this life saver to command line!


@umrashrf As the other discussion says, there are already plenty of tools that do watching for multiple pre-compiled languages like LESS, CoffeeScript, Jade, etc. Look into Grunt or Gulp if you'd like to watch and build from the command line.

Luke Page

If anyone wants a new repo on less that is a watcher and then wants to help us refactor lessc to integrate with that watcher then they are more than welcome, but given grunt and gulp its not on my list of priorities.


Not only Grunt and Gulp, but the multitude of other GUI-based compilers with watchers as well. I think it's a duplication of effort and something others have done a better job solving already. Not to mention avoiding all the inevitable watcher-related issues that will clutter the issue tracker.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Showing 1 unique commit by 1 author.

Feb 08, 2011
Paul Oswald Add 'watch' option to command line lessc 145f888
This page is out of date. Refresh to see the latest.

Showing 1 changed file with 19 additions and 3 deletions. Show diff stats Hide diff stats

  1. 22  bin/lessc
22  bin/lessc
@@ -2,7 +2,8 @@
2 2
3 3
 var path = require('path'),
4 4
     fs = require('fs'),
-    sys = require('sys');
+    sys = require('sys'),
+    util = require('util');
6 7
7 8
 require.paths.unshift(path.join(__dirname, '..', 'lib'));
8 9
@@ -40,6 +41,10 @@ args = args.filter(function (arg) {
40 41
         case 'compress':
41 42
             options.compress = true;
42 43
+        case 'w':
+        case 'watch':
+   = true;
+            break;
43 48
         case 'O0': options.optimization = 0; break;
44 49
         case 'O1': options.optimization = 1; break;
45 50
         case 'O2': options.optimization = 2; break;
@@ -62,7 +67,7 @@ if (! input) {
62 67
63 68
64 69
-fs.readFile(input, 'utf-8', function (e, data) {
+var processLessFile = function (e, data) {
66 71
     if (e) {
67 72
         sys.puts("lessc: " + e.message);
68 73
@@ -91,4 +96,15 @@ fs.readFile(input, 'utf-8', function (e, data) {
91 96
92 97
93 98
+if ( {
+    fs.watchFile(input, function (curr, prev) {
+        if (+curr.mtime > +prev.mtime) {
+            fs.readFile(input, 'utf-8', processLessFile);
+            util.log("Change detected... Updated");
+        }
+    });
+} else {
+    fs.readFile(input, 'utf-8', processLessFile);

Tip: You can add notes to lines in a file. Hover to the left of a line to make a note

Something went wrong with that request. Please try again.