user2883880
user2883880

Reputation: 221

auto compile not working in less

I have installed node, and npm. With npm I downloaded less.

And when I do

lessc styles.less styles.css -x -w

in terminal, it compiles and compresses the code, but doesnt watch the file for changes, since Im expecting LESS to auto compile and refresh the page automatically. So, if I do any changes in my styles.less, every-time I have to go to terminal and enter the command to compile the less css.

Also, the compiler does NOT even show any compile errors.

Please guide me on how to achieve the above. This is my first day with LESS CSS.

Upvotes: 0

Views: 1723

Answers (2)

Santiago Rebella
Santiago Rebella

Reputation: 2449

You could also install watchcompile

https://npmjs.org/package/watch-compile

sudo npm install -g watch-compile

Then in your less folder

watchcompile -c

and

watchcompile -f Watchfile -i 300

If any error will throw it in the console

Upvotes: 0

3bu1
3bu1

Reputation: 985

Simply put, the -w argument doesn't exist.

 $ lessc --help
    usage: lessc [option option=parameter ...] <source> [destination]

    If source is set to `-' (dash or hyphen-minus), input is read from stdin.

    options:
      -h, --help              Print help (this message) and exit.
      --include-path=PATHS    Set include paths. Separated by `:'. Use `;' on Windows.
      -M, --depends           Output a makefile import dependency list to stdout
      --no-color              Disable colorized output.
      --no-ie-compat          Disable IE compatibility checks.
      -l, --lint              Syntax check only (lint).
      -s, --silent            Suppress output of error messages.
      --strict-imports        Force evaluation of imports.
      --verbose               Be verbose.
      -v, --version           Print version number and exit.
      -x, --compress          Compress output by removing some whitespaces.
      --yui-compress          Compress output using ycssmin
      --max-line-len=LINELEN  Max line length used by ycssmin
      -O0, -O1, -O2           Set the parser's optimization level. The lower
                              the number, the less nodes it will create in the
                              tree. This could matter for debugging, or if you
                              want to access the individual nodes in the tree.
      --line-numbers=TYPE     Outputs filename and line numbers.
                              TYPE can be either 'comments', which will output
                              the debug info within comments, 'mediaquery'
                              that will output the information within a fake
                              media query which is compatible with the SASS
                              format, and 'all' which will do both.
      -rp, --rootpath=URL     Set rootpath for url rewriting in relative imports and urls.
                              Works with or without the relative-urls option.
      -ru, --relative-urls    re-write relative urls to the base less file.
      -sm=on|off              Turn on or off strict math, where in strict mode, math
      --strict-math=on|off    requires brackets. This option may default to on and then
                              be removed in the future.
      -su=on|off              Allow mixed units, e.g. 1px+1em or 1px*1px which have units
      --strict-units=on|off   that cannot be represented.

Report bugs to: http://github.com/cloudhead/less.js/issues
Home page: <http://lesscss.org/>

However, you can use inotify to watch for changes and this accomplishes roughly what you want:

while inotifywait `-r styles.less`; do

    lessc -x styles.less styles.css;

done

For a better long-term strategy, you might want to look at Grunt which does have its own watch mode.

Upvotes: 2

Related Questions