最近開始接觸前段開發，但上手就是grunt，抽了一天學習了一下，在這里記錄一下如何使用grunt，以便以后自己好查看。

（mac環境）

1.首先安裝CLI

CLI是grunt的命令行，如果要使用grunt 指令，首先需要安裝這個，但是注意這個東西并不是grunt

終端下輸入：

npm install -g grunt-cli

上述命令執行完后，grunt 命令就被加入到你的系統路徑中了，以后就可以在你項目的任何目錄下執行此命令了。

2.grunt項目需要的兩件重要文件

package.json文件：

這是當前項目信息的文件，主要包括項目名稱，版本，作者，描述，以及當前項目依賴的grunt插件。

在上傳到git上時，需要將這個文件一并傳入，這樣就不需要將grunt插件依賴的包一并上傳到git上，因為這個文件已經記錄了你需要依賴的包。

當別人克隆你的項目時，只需要進入該文件目錄，在命令行輸入grunt -init 便可以自動在網上加載依賴的包。（這里面只是記錄項目用到的grunt插件所依賴包）

Gruntfile.js文件：

Gruntfile由以下幾部分構成：（官方原文）

module.exports = function(grunt) {  // PRoject configuration.  grunt.initConfig({    pkg: grunt.file.readJSON('package.json'),    uglify: {      options: {        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> *//n'      },      build: {        src: 'src/<%= pkg.name %>.js',        dest: 'build/<%= pkg.name %>.min.js'      }    }  });  // 加載包含 "uglify" 任務的插件。  grunt.loadNpmTasks('grunt-contrib-uglify');  // 默認被執行的任務列表。  grunt.registerTask('default', ['uglify']);};怎么說這個文件呢，通俗一點講這個文件就是用來告訴grunt當你輸入命令時需要grunt做什么。
比如你需要檢測你的代碼，這時候你就需要在這個文件中寫入依賴的jshint的配置。
當在initConfig中配置完成后，通過  grunt.loadNpmTasks('grunt-contrib-jshint');   來加載jshint任務需要的插件。
最后通過  grunt.registerTask('param1',['jshint']);   函數注冊一下，這樣你就可以在命令行中輸入grunt param1。
（注意：param1是你給這個任務取得名字，這個名字隨意你寫成jiancha也可以，主要是為了你自己好記）。
3.如何創建以上兩個文件
如果你是在git上clone的項目，那么肯定是會有package.json文件的（除非有人粗心或者故意把這文件ignore了）。
這時候你并不需要自己創建這個文件，只需要通過終端進入該文件目錄，輸入grunt -init便可以自動加載該項目依賴的包。
如果你是自己寫的一個新項目，那么可以通過終端進入項目的目錄下(建議與src文件同目錄)，輸入npm init 便可以自動創建該文件，其中需要輸入一些配置信息，就算你偷懶全部回車也可以，建議還是填寫一下。
其實就是一些項目名稱，作者，版本之類的基本信息。然后，你在目錄下便會有package.json文件以及基本的配置信息了。
Gruntfile.js文件需要自己手動創建，既然都已經到這一步，那么自己創建也可以，可以參靠一下網上實例，寫這個文件才是你是否真的會用grunt的標準（很簡單的，畢竟grunt只是一個工具）。
4.安裝grunt
看了這么多，弄了這么多，其實我們還是沒有安裝grunt，那這時候我們就來安裝一下grunt吧。
在終端下進入項目目錄，也就是包含你的src文件的目錄，
輸入npm install <module> --save-dev命令即可，<module>指的grunt的版本。
如果你將它替換成grunt，比如npm install grunt --save-dev 那么它就默認安裝的是最近版的grunt。
--save-dev表示將grunt的版本信息添加到package.json文件的devDependencies屬性下。
5.如何安裝插件
npm install grunt-contrib-jshint --save-dev
沒錯，就這么一個簡單的命令就可以，我這里安裝的是jshint插件，根據你的需要把grunt-contrib-jshint換成你需要的插件就行了。
剛接觸前端，怕自己忘了就迫不及待的寫了這篇文章，以后用多了再填這個坑吧。