In this recipe, we'll make use of the contrib-less (0.11.4)
plugin to compile our LESS style sheets to CSS style sheets, which can be used by our web applications.
In this example, we'll work with the basic project structure we created in the Installing Grunt on a project recipe in Chapter 1, Getting Started with Grunt. Be sure to refer to it if you are not yet familiar with its contents.
The following steps will take us through creating a simple LESS style sheet and compiling it to CSS:
We'll start by installing the package that contains the
contrib-less
plugin, as per the instructions provided in the Installing a plugin recipe in Chapter 1, Getting Started with Grunt.Let's create a simple LESS file called
styles.less
in our project directory with the following contents:@first: #ffffff; @second: #000000; body { background-color: @first; background-image: url('../background.png'); color: @second; }
Now, we can add the following
less
task...