How to install Grunt on Mac OSX

Spread the love

Grunt is a JavaScript task runner, a tool used to automatically perform frequently used tasks like minify CSS, SASS compilation and watching JS files for changes and much more. You can install Grunt on Mac OSX using npm (node packaging manager). Following are the most common tasks performed using grunt:

 

  1. Uglify Javascript code.
  2. Concat multiple file.
  3. Watch files for changes
  4. Code validation with jsHint etc.
  5. Copy files from one location to another.

Before installing Grunt, update your npm package (This might need sudo based on your system permission ).

or

If you are using sudo option, you are asked to enter password.

Install Grunt CLI

Now you need to install grunt cli. This will allow you to access grunt command for your system.

Checking Grunt installed Version

Now after installing grunt cli, you can check grunt version by using following command.



Install Grunt locally for Project

For Existing Projects

Now if you have a existing project with package.json maintained. You can just go ahead with following command:

Above command will do following things:

  1. Install grunt package locally for your project.
  2. Add grunt directory inside node_modules directory.
  3. Add a grunt entry in package.json as we have used –save option.

For New Project

If you are starting with new project, you have to follow these steps:

  1. Create package.json at root of your project directory either manually or using npm init command.
  2. After first step, your file should look something like this.

3. Now you have basic setup done for your project. You can follow above steps For Existing Projects.

Creating GruntFile

After you are done with above installation, you have to create Gruntfile.js in root directory of your project. Now you can add grunt tasks and run them accordingly. A sample Gruntfile.js will look like below:

Fo more detail information, you can READ HERE

Happy task Management using Grunt :).

 

 



Leave a Reply

Your email address will not be published. Required fields are marked *