LESS comes with a preview window located at the right side of the editor. It shows the compiled output every time you save the document.
The dynamic stylesheet language.
LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions.
Web Essentials uses the node-less compiler and it always uses the latest version
You can set all the compiler settings from Tools -> Options. They include:
- Compile on save
- Compile on build
- Enable minification
Web Essentials uses NodeJS to run the compiler. It's the fastest and most accurate compiler for LESS available.
Source Map generation is fully supported and will produce .map files. This feature can be enabled in the Options dialog.
If you want the compiled output in a separate folder, then you can specify which one in the Options dialog.
Web Essentials makes it easy to convert property values to LESS variables. Select the text you want extracted, right-click the selection and click "Extract to variable...".
Colors are special cased and a Smart Tag makes it easy to extract all instances of the same color in the document into a LESS variable.
Select the properties you want to extract. Then right-click the selection and click "Extract to mixin...".
When a LESS file is compiled, it can now also be minified to produce a much smaller CSS file.