In this recipe, we'll make use of the contrib-stylus (0.18.0)
plugin to compile our Stylus style sheets to CSS style sheets, which can be used by our web application.
In this example, we'll work with the basic project structure that 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 Stylus style sheet and compiling it to CSS:
We'll start by installing the package that contains the
contrib-stylus
plugin, as per the instructions provided in the Installing a plugin recipe in Chapter 1, Getting Started with Grunt.Let's create a simple Stylus file called
styles.styl
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
stylus...