1、nodeJs 環境安裝？
進入官網：http://www.nodejs.org/ 根據操作系統，下載相應的安裝包，直接安裝即可。
2、npm 安裝？
a) 如果系統沒有安裝過Git，可以直接到https://github.com/isaacs/npm下載npm所需要的文件。
b) 如果有Git 可以使用git下載。
git clone --recursive git://github.com/isaacs/npm.git
下載到NPM文件后，命令行首先轉到npm所在地址，輸入以下代碼進行安裝。
node cli.js install npm -gf
3、grunt-cli安裝？
npm install grunt-cli -g
grunt-cli表示安裝的是grunt的命令行界面，參數g表示全局安裝。
4、package.json？
Grunt使用模塊結構，除了安裝命令行界面以外，還要根據需要安裝相應的模塊。這些模塊應該采用局部安裝，因為不同項目可能需要同一個模塊的不同版本。
首先，在項目的根目錄下，創建一個文本文件package.json，指定當前項目所需的模塊。下面就是一個例子。
{ "name": "vdian", "version": "0.1.0", "author": "vdian", "devDependencies": { "grunt": "0.x.x", "grunt-contrib-jshint": "*", "grunt-contrib-concat": "~0.1.1", "grunt-contrib-uglify": "~0.1.0", "grunt-contrib-watch": "~0.1.4" } }
上面這個package.json文件中，除了注明項目的名稱和版本以外，還在devDependencies屬性中指定了項目依賴的grunt模塊和版本：grunt核心模塊為最新的0.x.x版，jshint插件為最新版本，concat插件不低於0.1.1版，uglify插件不低於0.1.0版，watch插件不低於0.1.4版。
然后，在項目的根目錄下運行下面的命令，這些插件就會被自動安裝在node_modules子目錄。
npm install
上面這種方法是針對已有package.json的情況。如果想要自動生成package.json文件，可以使用npm init命令，按照屏幕提示回答所需模塊的名稱和版本即可。
npm init
如果已有的package.json文件不包括Grunt模塊，可以在直接安裝Grunt模塊的時候，加上--save-dev參數，該模塊就會自動被加入package.json文件。
npm install <module> --save-dev
比如，對應上面package.json文件指定的模塊，需要運行以下npm命令
npm install grunt --save-dev npm install grunt-contrib-jshint --save-dev npm install grunt-contrib-concat --save-dev npm install grunt-contrib-uglify --save-dev npm install grunt-contrib-watch --save-dev
5、命令腳本文件Gruntfile.js？
模塊安裝完以后，下一步在項目的根目錄下，新建腳本文件Gruntfile.js。它是grunt的配置文件，就好像package.json是npm的配置文件一樣。Gruntfile.js就是一般的Node.js模塊的寫法。
module.exports = function(grunt) { // 配置Grunt各種模塊的參數 grunt.initConfig({ jshint: { /* jshint的參數 */ }, concat: { /* concat的參數 */ }, uglify: { /* uglify的參數 */ }, watch: { /* watch的參數 */ } }); // 從node_modules目錄加載模塊文件 grunt.loadNpmTasks('grunt-contrib-jshint'); grunt.loadNpmTasks('grunt-contrib-concat'); grunt.loadNpmTasks('grunt-contrib-uglify'); grunt.loadNpmTasks('grunt-contrib-watch'); // 每行registerTask定義一個任務 grunt.registerTask('default', ['jshint', 'concat', 'uglify']); grunt.registerTask('check', ['jshint']); };
上面的代碼用到了grunt代碼的三個方法：
grunt.initConfig：定義各種模塊的參數，每一個成員項對應一個同名模塊。
grunt.loadNpmTasks：加載完成任務所需的模塊。
grunt.registerTask：定義具體的任務。第一個參數為任務名，第二個參數是一個數組，表示該任務需要依次使用的模塊。default任務名表示，如果直接輸入grunt命令，后面不跟任何參數，這時所調用的模塊（該例為jshint，concat和uglify）；該例的check任務則表示使用jshint插件對代碼進行語法檢查。
上面的代碼一共加載了四個模塊：jshint（檢查語法錯誤）、concat（合並文件）、uglify（壓縮代碼）和watch（自動執行）。接下來，有兩種使用方法。
（1）命令行執行某個模塊，比如
grunt jshint
上面代碼表示運行jshint模塊。
（2）命令行執行某個任務。比如
grunt check
上面代碼表示運行check任務。如果運行成功，就會顯示“Done, without errors.”。
如果沒有給出任務名，只鍵入grunt，就表示執行默認的default任務。