Brief:
Grunt is a javascript task runner, that will make our work easy in compiling and minimizing .css and .js files. Installing grunt requires node.js to be installed first. Once node.js is installed you can then install grunt using npm. The two important files required for grunt to work on a new project are packages.json and grunt.js. Packages.json contains all the information about the dependencies required for grunt to work. Grunt.js contains the names of the js and css that needs to be compiled in a predefined syntax format.
Need:
Performing some repetitive tasks such as concatenating and compressing css and js files for production, becomes tedious and time consuming over the time and as code base increases. Concatenating it every time manually might also result in loss code and hence we end up having issues deploying the code live.
Installing grunt:
The basic prerequisite to install grunt is to install Node. Node is pretty simple to be installed. Go to https://nodejs.org/en/ select the latest Node download that fulfills your machine requirement. Install node following the setup steps provided the Node UI.
Once Node is installed successfully, navigate to your project root and create a file packages.json. In packages.json mention you project dependencies. Here is how the file looks like.
{
"name": "test",
"version": "0.1.0",
"devDependencies": {
"grunt": "~0.4.5"
}
}
You can add different packages that your project requires in this packages.json file.
Now in command line navigate to your project root and fire npm install. This will create a node_modules folder in the project directory. This folder consists of all the packages or dependencies that you mentioned in your packages.json file.
After this in the same command line fire npm install -g grunt-cli. This will install grunt globally for your project.
Once grunt is installed successfully, you can create a grunt.js file, this file contains the information that grunt needs to perform. This can include concatenating files, minifying, running unit tests, watch. Watch will help in grunt to keep the track of changes happening to the files mentioned in the grunt tasks. This helps in performing grunt tasks automatically instead of running grunt through command line every time.
There are large number of plugins available with grunt. This plugins can be installed and used to perform various tasks. You can visit http://gruntjs.com/ for information about these plugins and grunt configuration.
Grunt is a javascript task runner, that will make our work easy in compiling and minimizing .css and .js files. Installing grunt requires node.js to be installed first. Once node.js is installed you can then install grunt using npm. The two important files required for grunt to work on a new project are packages.json and grunt.js. Packages.json contains all the information about the dependencies required for grunt to work. Grunt.js contains the names of the js and css that needs to be compiled in a predefined syntax format.
Need:
Performing some repetitive tasks such as concatenating and compressing css and js files for production, becomes tedious and time consuming over the time and as code base increases. Concatenating it every time manually might also result in loss code and hence we end up having issues deploying the code live.
Installing grunt:
The basic prerequisite to install grunt is to install Node. Node is pretty simple to be installed. Go to https://nodejs.org/en/ select the latest Node download that fulfills your machine requirement. Install node following the setup steps provided the Node UI.
Once Node is installed successfully, navigate to your project root and create a file packages.json. In packages.json mention you project dependencies. Here is how the file looks like.
{
"name": "test",
"version": "0.1.0",
"devDependencies": {
"grunt": "~0.4.5"
}
}
You can add different packages that your project requires in this packages.json file.
Now in command line navigate to your project root and fire npm install. This will create a node_modules folder in the project directory. This folder consists of all the packages or dependencies that you mentioned in your packages.json file.
After this in the same command line fire npm install -g grunt-cli. This will install grunt globally for your project.
Once grunt is installed successfully, you can create a grunt.js file, this file contains the information that grunt needs to perform. This can include concatenating files, minifying, running unit tests, watch. Watch will help in grunt to keep the track of changes happening to the files mentioned in the grunt tasks. This helps in performing grunt tasks automatically instead of running grunt through command line every time.
There are large number of plugins available with grunt. This plugins can be installed and used to perform various tasks. You can visit http://gruntjs.com/ for information about these plugins and grunt configuration.