Grunt – setup and run first simple task

Grunt is a JavaScript Task Runner. Any task runner is used for automating the repetitive tasks to increase productivity and efficiency.

Some of the automated tasks include

  • Implement standards
  • Unit Testing
  • End to end testing
  • Compiling
  • Automated task execution
  • File watching

Grunt is a command line tool available on the node platform. Once you have installed node, you would need to run the following command to make grunt command line available in your project.

npm install -g grunt-cli

To run grunt commands we would also require to create a Gruntfile.js because depending on the make of the grunt tool it looks for this file. Once we have this file then we could configure tasks inline, load tasks from external sources (files and modules), etc.

It’s always easy for me when I do some hand on so that’s what we would do. Create a new file named Gruntfile.js and add the following code to it.

 

 

Now move the folder where you created the Gruntfile.js and add a new file named as package.json. We will add the package that we care about which is uglify.

 

 

Download jQuery.version.js file or any other JavaScript that you would want to minify and add to the same folder

Now run the following command in your command line tool

  1. npm install -g grunt-cli

 

  1. npm init – fills all details is package.json

  1. npm install grunt (for grunt dependencies.)

 

  1. npm install

 

 

  1. grunt

 

 

And boom we have created our first Grunt automated task to minify a JavaScript file.

You can download the source code @googledrive or @onedrive