SaltyCrane Blog — Notes on JavaScript and web development

How to install grunt on Ubuntu 14.04

Date:  |  Modified:  |  Tags: javascript  |  10 Comments

Grunt is a JavaScript task runner that can be used to compile Sass, run JSHint, or run many other plugins. It depends on the Node.js package manager, npm.

If you use the standard Ubuntu Trusty Tahr repository to install nodejs/npm, you will get this error when running grunt:

/usr/bin/env: node: No such file or directory
Instead, use the chris-lea nodejs repository.

Install nodejs, npm, and grunt-cli

$ sudo add-apt-repository ppa:chris-lea/node.js 
$ sudo apt-get update 
$ sudo apt-get install nodejs 
$ sudo npm install -g grunt-cli

Install grunt in your project directory

$ cd ~/myproject 
$ echo "{}" > package.json 
$ npm install grunt --save-dev

Verify grunt is installed

$ nodejs --version 
v0.10.33
$ npm --version 
1.4.28
$ grunt --version 
grunt-cli v0.1.13
grunt v0.4.5

Run a simple grunt task

  1. $ cd ~/myproject
  2. Create a package.json file:
    {
  "name": "my-project-name",
  "version": "0.1.0",
  "devDependencies": {
    "grunt": "~0.4.5",
    "grunt-contrib-uglify": "~0.5.0"
  }
}
  3. Install grunt-contrib-uglify
    $ npm install 
npm WARN package.json [email protected] No description
npm WARN package.json [email protected] No repository field.
npm WARN package.json [email protected] No README data
[email protected] node_modules/grunt-contrib-uglify
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected]
├── [email protected] ([email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected], [email protected])
  4. Get an example unminified JS file:
    $ wget http://code.jquery.com/jquery-2.1.1.js 
--2014-11-22 00:47:31--  http://code.jquery.com/jquery-2.1.1.js
Resolving code.jquery.com (code.jquery.com)... 94.31.29.53, 94.31.29.230
Connecting to code.jquery.com (code.jquery.com)|94.31.29.53|:80... connected.
HTTP request sent, awaiting response... 200 OK
Length: 247351 (242K) [application/x-javascript]
Saving to: ‘jquery-2.1.1.js’

100%[================================================================================================================>] 247,351     --.-K/s   in 0.1s    

2014-11-22 00:47:31 (1.71 MB/s) - ‘jquery-2.1.1.js’ saved [247351/247351]
  5. Create a Gruntfile.js file:
    module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
      build: {
        src: 'jquery-2.1.1.js',
        dest: 'jquery-2.1.1.min.js'
      }
    }
  });
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.registerTask('default', ['uglify']);
};
  6. Run the grunt task:
    $ grunt 
Running "uglify:build" (uglify) task

Done, without errors.
  7. You should now have a minified file, jquery-2.1.1.min.js
    $ ls -gG jquery* 
-rw-rw-r-- 1 247351 2014 10/23 17:16 jquery-2.1.1.js
-rw-rw-r-- 1  84113 2014 11/22 00:48 jquery-2.1.1.min.js

References

Comments


#1 Bradford commented on :

You could alternatively install nodejs-legacy. This stackoverflow answer discusses the reason for the extra package.


#2 Eliot commented on :

Bradford, thanks for the tip and link. I guess that is a more stable alternative.


#3 다롱이 commented on :

Thanks your tutorial,, I wonder How can make package file (.json) in ubuntu

disqus:1872122751


#5 Devin Nelson commented on :

The cause of the error "/usr/bin/env: node: No such file or directory" is because it is looking for nodejs under /usr/bin/node.

If you make a symbolic link for node (i.e. sudo ln -s /usr/bin/nodejs /usr/bin/node) the error should resolve and you can install grunt directly from: 'npm install -g grunt-cli' and 'npm install grunt'

disqus:2010620127


#6 Carl VanderLaan commented on :

Curious, do you know how I can get Grunt to auto-run when I restart my server?

disqus:2554138664


#7 B. Ema commented on :

Thank you a million times. You shall live long.

disqus:2770338961


#8 Aziz Alqudsy commented on :

Thanks Devin, you're awesome!

disqus:2979898070


#9 Samadhan Sonawane commented on :

installed npm and nodejs but, grunt is not installed.

when i execute command grunt --version nothing is in the putput.

disqus:3070661324


#10 Preacher commented on :

You should add
sudo apt-get install npm
too in the install nodejs section..

disqus:3178634907