Error “Cannot find module ‘less’” with Symfony2, Assetic and Twitter Bootstrap

We have been using Twitter Bootstrap CSS and Javascript library for some projects and it requires the use of LESS. For those of you not familiar with LESS, LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. When you run LESS on the server-side it will integrate nicely with Symfony2 thanks to Assetic.

Unfortunately the Symfony documentation does not provide any details on how to configure Assetic to use LESS. There is a blog post by Dustin Dobervich that gives some pointers, but after following the instructions, Assetic issued the following error: Cannot find module ‘less’.

We searched around without much success. After several tries, we nailed the configuration.

1) Make sure you install less in the global node setup, to do this install less with the following command:

$ sudo npm install -g less

2) Edit the Symfony configuration file app/config.yml with the proper path for the Node modules:

 assetic:
   debug: %kernel.debug%
   use_controller: false
   filters:
     cssrewrite: ~
     less:
       node: /usr/local/bin/node
       node_paths: [/usr/local/lib/node_modules]

If all is correct, Assetic should parse the .less files and generate pretty .css files with no errors.