Automate Builds using GruntJS

I already wrote about the awesomeness of GruntJS and here is how to set up your own Grunt system.

GruntJS runs on nodejs so you need that installed first. Once nodejs and npm are installed, use the following command to install Grunt (the -g flag installs it globally).

npm install -g grunt-cli

npm init

You can safely use the defaults suggested during the npm init process; this process creates a package.json file which contains information about the licence, repository, author and blah blah blah. You can also use pre-created package.json files to tell the node package manager what dependencies to install. Make sure you keep the package.json file safe – it can be used to recreate your project or share project details with other developers. If you get weird errors, try prefixing the commands with sudo. Type grunt now and if you this error: ‘A valid Gruntfile could not be found…‘; then give yourself a pat on the back! :)

When installing new plugins, remember to add the –save-dev switch so that your package.json file is updated. For example, to add the requirejs plugin, you’d type something like this:

npm install grunt-contrib-requirejs –save-dev

Once you’ve installed the plugins, you need to instruct Grunt to load these plugins. Adding grunt.loadNpmTasks(‘grunt-contrib-requirejs’) to your Gruntfile will fix this.

Next, you need to specify the tasks in the Gruntfile; you set up the plugin’s config options – details such as location of input files, the name and location of its output and some other options depending on the plugin. After this, you register the task with the grunt.registerTask() hook. See the sample config file for a demo.

The Gist below shows a sample commented Gruntfile. The default task is run whenever you type grunt at the CLI; however to run other tasks you need to specify the task name; in the sample file below, typing grunt test will run the jshint:js and qunit tasks.