LESS is a popular CSS pre-processor. Used on the Twitter Bootstrap project and on many others, LESS makes CSS more powerful by giving designers and developers access to variables, mixins, functions, string interpolation, imports, and many other features.
LESS Previewer was cooked us as a way to visualize LESS output quickly by running it directly through the LESS processor. This allows you to test various version of LESS and their support (or lack thereof) of the syntax you are using.
Because LESS has very different levels of support for certain syntax depending on the version, it's often nice to be able to test this directly.
For example selector interpolation like this only works in 1.3.1+
@mySelector: home-base;
.@{mySelector} {
display: block;
}If needed a style-guide will be created for contributors. In the meantime, if you'd like to contribute, please take care to follow the general style of the project.
- Install grunt-cli:
$ [sudo] npm install -g grunt-cli. - Install express:
$ [sudo] npm install -g express - Install dependencies (from root project folder):
$ npm install - Run Grunt (from root project folder):
$ grunt - Start the app:
$ npm start. This will start the app on http://localhost:3000/. Nodemon will restart the server automatically when it detects a change. - Open a new terminal tab or window and start the watcher task:
$ grunt watch. This will compile coffee-script to js, run jshint on the output, and minify the files, and run all unit tests.
Please feel free to contribute or suggest features and improvements.