這里為了節(jié)省時間，這里先創(chuàng)建一個angular 項目
cd /Users/yuyi/Documents/workSpace
ng new GruntDome
項目名稱 GruntTest
目錄js a.js main b.js package.json Gruntfile.js
devDependencies 開發(fā)依賴
Grunt介紹
Grunt是一個自動化的項目構(gòu)建工具。如果你需要重復的執(zhí)行像壓縮缘薛、 編譯、 單元測試泞边、代碼檢查以及打包發(fā)布的任務馍资。 那么你可以使用Grunt來處理這些任務穴店， 你所需要做的只是配置好Grunt膀捷， 這樣能很大程度的簡化你的工作迈嘹。
grunt安裝
Grunt和Grunt插件都是通過npm、Node.js包管理器安裝和管理的全庸。實際上秀仲，安裝的并不是Grunt，而是Grunt-cli壶笼，也就是命令行的Grunt神僵，這樣你就可以使用grunt命令來執(zhí)行項目中的Gruntfile.js中定義的task。但是要注意覆劈，Grunt-cli只是一個命令行工具保礼，用來執(zhí)行沛励，而不是Grunt這個工具本身。下面的代碼可以在全局范圍安裝Grunt-cli氓英，全局安裝侯勉，會有權(quán)限的問題鹦筹，所以Linux環(huán)境下 前面加sudo铝阐，Windows用管理員權(quán)限。
sudo npm install -g grunt-cli
安裝成功铐拐，版本號1.2.0
然后在具體的項目中徘键，安裝grunt。
cd /Users/yuyi/Desktop/GruntTest
npm install grunt --save-dev
--save-dev 的意思是遍蟋，在當前目錄安裝grunt的同時吹害，順便把grunt保存為這個目錄的開發(fā)依賴項⌒榍啵可以在package.json的“devDependencies”中就會存儲開發(fā)依賴項它呀。
而且多出了一個"node_modules"文件夾，里面的grunt文件夾就是存儲grunt源文件的地方棒厘。
現(xiàn)在纵穿，在終端里面運行g(shù)runt命令，會報錯 Fatal error: Unable to find Gruntfile.這個就是缺少Gruntfile.js文件奢人。
配置Gruntfile.js
首先來配置一個最簡單的：
module.exports = function(grunt) {
grunt.initConfig({
});
grunt.registerTask('default', []);
};
然后谓媒，運行g(shù)runt。這里顯示.done何乎，表示通過句惯。
安裝Grunt插件
下面是幾個最常用的插件
Contrib-jshint——javascript語法錯誤檢查；
Contrib-watch——實時監(jiān)控文件變化支救、調(diào)用相應的任務重新執(zhí)行抢野；
Contrib-clean——清空文件、文件夾各墨；
Contrib-uglify——壓縮javascript代碼
Contrib-copy——復制文件蒙保、文件夾
Contrib-concat——合并多個文件的代碼到一個文件中
karma——前端自動化測試工具
先看uglify插件，這個是壓手JS代碼的欲主〉瞬蓿看看幾乎每個類庫或者框架，都有一個***.min.js壓縮版扁瓢。
安裝插件的方式和安裝grunt一樣详恼。
npm install grunt-contrib-uglify --save-dev
然后再src目錄下新建test.js，然后隨便寫一點代碼引几。然后要把這個js文件進行壓縮昧互。
壓縮哪個文件挽铁，和往哪里壓縮都需要在Gruntfile.js里面配置。
uglify: {
options: {},
build: {
src: ['src/test.js'],
dest: 'src/app.min.js'
}
}
//加載配置
grunt.loadNpmTasks('grunt-contrib-uglify');
options參數(shù)具體可以參照官網(wǎng)敞掘，有帶有banner的叽掘？。build添加的任務玖雁，當然可以多個任務更扁，SPA就是這么做的。src:是目標文件赫冬，dest是導出的文件浓镜。
然后看看最常用的代碼檢查插件jshint
sudo npm install grunt-contrib-jshint
安裝成功然后，在Gruntfile.js配置一下劲厌，才能正常使用膛薛。配置如下
/jshint代碼檢查插件的配置信息/
jshint: {
build: ['Gruntfile.js', 'src/*.js'],
options: {
jshintrc: '.jshintrc'
}
}
//加載配置
grunt.loadNpmTasks('grunt-contrib-jshint');
http://www.reibang.com/p/4cb23f9e19d3
任務配置代碼、插件加載代碼补鼻、任務注冊代碼
