How do I compile a directory full of less css files to css?

Solution 1:

The way to do this is what bootstrap does - have a file which imports all the others and compile that.

@import "variables.less"; 
@import "mixins.less";

Solution 2:

You can use the following bash one-liner to compile and all less files in a directory and its subdirectories into a single css file "combined.css":

$ find less_directory/ -name '*.less' -exec lessc {} \; > combined.css

Or minified for production:

$ find less_directory/ -name '*.less' -exec lessc -x {} \; > combined.css

Solution 3:

If you want compile multiple less files into multiple css files try this one-liner bash script:

for file in *.less; do lessc -x --yui-compress -O2 --strict-imports $file `basename $file`.css ; done

You will get a list of .less.css files after run the command.

PS: It addittionaly optimizes (-O2) at maximum, compress (-x) and minifies with YUI Compressor (--yui-compress) with strict import evaluation (--strict-imports).

EDITED: For new YUI Compressor versions skip -02 and --yui-compress deprecated, so:

for file in *.less; do lessc -x --strict-imports $file `basename $file`.css ; done

Solution 4:

This bash script works for me:

find "$PWD" -name '*.less' | while read line; do
    REPLACE=`echo $line | sed "s|\.less|\.css|"`

    # echo "$line --> $REPLACE"
    (lessc "$line" "$REPLACE" &)
done