Grunt，簡而言之，就是運行在Node.js上面的任務管理器（task runner），其可以在任何語言和項目中自動化指定的任務。我們可通過npm來安裝Grunt和Grunt插件
為什么使用Grunt？
一詞概括：自動化。
Grunt幫助你提高重復項目的性能，比如：
- Minification
- Compilation
- Unit testing
- Linting and more
安裝 Grunt CLI：
為了獲得Grunt的更多產品特性，你需要全局安裝Grunt's 命令行接口（CLI），運行下面的代碼：
npm install -g grunt-cli
上述將你額grunt命令運行在你的系統路徑上，這確保了其可以在任何的文件夾下面運行成功。
注意安裝了grunt-cil並不意味這安裝了Grunt 任務管理器（task runner）！
Grunt CLI是運行安裝在鄰近Gruntfile的Grunt版本。這允許了在同一台機器上同時安裝不同版本的Grunt。
怎樣在你的項目中使用Grunt
1.創建項目根目錄
首先創建一個空的項目根目錄且在目錄中創建下面的文件：
- package.json :這是npm使用的文件，用來存儲作為npm模塊發布的項目的meta數據。如果我們想要列舉Grunt或者Grunt插件，那么我們需要在package.json文件中將此項目作為devDependencies。 這個文件需要放在項目的根目錄中，你也可以使用nmp init命令來生成這個文件
- cruntfile.js這個文件用來設置和定義任務以及加載Grunt插件。這個Gruntfile.js 文件同樣需要放置在項目根目錄中。 你如果需要在coffee腳本中配置任務，你可以同樣命名此文件為 Gruntfile.coffee 。下文中將會討論這個文件的具體內容。
2.增加Grutn 模塊到你的項目中
我們接下來需要使用npm來增加Grunt 模塊到你的項目中
運行如下語句
> npm install grunt --save-dev
上述命令安裝了Grutn同時也在package,json中創建了一個入口，此入口說明了這個模塊將作為devDependency。 被標記為devDependency的模塊只能是在開發環境中（development environment）安裝的模塊。在產品環境（producion environment）中安裝它們將被忽略。
理解Gruntfile文件
Gruntfile是一個有效的js或者CooffeeScript文件，放置在項目更目錄中，和package.json一起放置，並且需要和你的項目元一起提交。 一個Gruntfile文件包含下面三部分：
1.“包裹（wrapper）”函數
2.項目和任務配置
3.加載的Grunt插件和任務
4.典型任務（custom tasks）
讓我們逐一討論：
關於Gruntfile中的“包裹（wrapper）”函數
wrapper函數是指定到module exports上的封裝所有Grunt代碼的函數。這個函數被Grunt引擎調用，並且作為Grunt配置的入口點。因此，至此我們的Gruntfile看起來如下：
module.exports = function(grunt) { // Do grunt-related things in here };
所有的Gruntfile和Grunt 插件使用上述基本形式，且你所有的Grunt代碼必須寫在函數中
Gruntfile中的項目和任務配置
大多數的Grunt任務依賴於賦值到grunt.initConfig方法上的對象中的配置數據。 這就是我門為什么需要為我們需要的插件指定配置參數。我們可以同樣指定我們將要適用的配置參數。讓我們定義一些隨機的配置參數：
module.exports = function(grunt) { // Project configuration. grunt.initConfig({ //Lets read the project package.json pkg: grunt.file.readJSON('package.json'), //Some other configs someKey: 'Some Value', author: 'Modulus.io' }); };
Grunt同樣有一些幫助方法；其中的一個就是閱讀文件。
所以我們使用grunt.file.readJson 來讀取我們的package.json 文件並且存儲轉義好的對象到pkg key中。
我們同樣可以將這些配置值設置成變量，動態化你的配置字符串。如下：
module.exports = function (grunt) { // Project configuration. grunt.initConfig({ //Lets read the project package.json pkg: grunt.file.readJSON('package.json'), //Some other configs someKey: 'Some Value', author: 'Modulus.io', filePostfix: '-<%= pkg.name %>-<%= pkg.version %>', greetingMessage: 'Running Grunt for project: <%= pkg.name %>, Version: <%= pkg.version %>, Author: <%= author %>' }); };
上面我們使用 <%= varName %> 來確定string中的動態文本
加載的Grunt以及Grunt 配置
許多通常使用的任務比如concatenation，minificationhe linting對於Grunt插件而言是可用的，只要你在安裝npm的時候在package.js中將插件定義成dependency，那么就可以在Gruntfile內部使用。
讓我們安裝一個簡單的插件，grunt-clean到你的項目總共且嘗試在Gruntfile中配置。使用下述命令通過vpm來安裝這個模塊
> npm install grunt-contrib-clean --save-dev
現在我們可以通過grunt.loadNpmTask('pluginName') 方法在我們的Gruntfile中加載這個任務，且做一些所需的配置。現在我們的Gruntfil文件如下：
module.exports = function (grunt) { // Project configuration. grunt.initConfig({ //Lets read the project package.json pkg: grunt.file.readJSON('package.json'), //Some other configs someKey: 'Some Value', author: 'Modulus.io', filePostfix: '-<%= pkg.name %>-<%= pkg.version %>', greetingMessage: 'Running Grunt for project: <%= pkg.name %>, Version: <%= pkg.version %>, Author: <%= author %>', //Configure Clean Module clean: ['.tmp', 'dist', 'npm-debug.log'] }); // Load the plugin that provides the "clean" task. grunt.loadNpmTasks('grunt-contrib-clean'); };
在上面的例子中，我們配置 clean 來刪除 .tmp和dist文件夾以及項目根文件的npm-debug.log文件。你可指定任何數量的文件夾或者磁盤。每一個插件都有文檔，用來指明必要的配置參數和形式（format）
注意：grunt --help 命令展示出所有可用的任務（tasks）
現在，在項目根目錄下面嘗試運行以下代碼：
> grunt clean
這個命令用來刪除特定的文件和配置的文件
Gruntfile中特定的子任務
因為子任務（sub task）被很多的插件支持，所以你同樣可以設置子任務。為了理解這個概念，讓我們看看下面的例子：
module.exports = function (grunt) { ***javascript*** // Project configuration. grunt.initConfig({ //Lets read the project package.json pkg: grunt.file.readJSON('package.json'), //Some other configs someKey: 'Some Value', author: 'Modulus.io', filePostfix: '-<%= pkg.name %>-<%= pkg.version %>', greetingMessage: 'Running Grunt for project: <%= pkg.name %>, Version: <%= pkg.version %>, Author: <%= author %>', //Configure Clean Module clean: { npm: 'npm-debug.log', temp: ['temp', '.tmp'], dist: ['dist', 'out/dist'] } }); // Load the plugin that provides the "clean" task. grunt.loadNpmTasks('grunt-contrib-clean'); };
在參數配置中我們指明了一個有着不同健（keys）的對象，這些健包含npm,temp和dist。
為划分任務成為子任務，我們可以想出很多的隨意的名字。 現在我們可以運行子任務（subtasks）來刪除所有上述的文件和磁盤，或者來刪除一個子集團（subgroup）。下面進行說明：
#刪除所有的文件包括npm-debug.log, temp, .tmp, dist, out/dist ： grunt clean
#只刪除npm-debug.log 文件：grunt clean:npm
#只刪除temp文件： grunt clean:temp
#只刪除dist, out/dist文件：grunt clean:dist
在上面的例子中，我們特定化了在config中設置的key來運行子任務（subtask）。用來書寫key的語法是：
> grunt TaskName:SubTaskKeySpecifiedInConfig
用戶自定義任務custom tasks
你可以使用自定義的名字來定義任務的名字。可以給已經存在的任務聯合在一起命名亦可只是針對你自己的implementation來命名。如果你想implement自定義的任務，你必須在js中implement
讓我們來給已經存在的任務的集合命名，且也給我們自己的implementment命名：
module.exports = function (grunt) { // Project configuration. grunt.initConfig({ //Lets read the project package.json pkg: grunt.file.readJSON('package.json'), //Some other configs someKey: 'Some Value', author: 'Modulus.io', filePostfix: '-<%= pkg.name %>-<%= pkg.version %>', greetingMessage: 'Running Grunt for project: <%= pkg.name %>, Version: <%= pkg.version %>, Author: <%= author %>. ', //Configure Clean Module clean: { npm: 'npm-debug.log', temp: ['temp', '.tmp'], dist: ['dist', 'out/dist'] } }); // Load the plugin that provides the "clean" task. grunt.loadNpmTasks('grunt-contrib-clean'); //Lets register a basic task. grunt.registerTask('print-info', 'Lets print some info about the project.', function() { grunt.log.write(grunt.config('greetingMessage')).ok(); }); //Specify a custom task which is combination of tasks. grunt.registerTask('my-clean', ['print-info', 'clean:dist', 'clean:npm']); };
在上述例子中，我們創建了一個用戶自定義項目print-info， 且在js中執行它。
我們使用grunt.registerTask()方法。
同時我們也定義了一個用戶自定義的任務my-clean，這是其他任務的聯合體。
因為你在任務中運行任何的js文件，所以命名有多重可能性。
使用下面的命令來看看哪些任務是可用的：
> grunt --help
你應該可見兩個你指定的用戶自定義任務（custom tasks），現在你可以運行你的my-clean 任務：
> grunt my-clean
默認任務：
當你木有特別指明任何的文件就在你的項目根目錄下面運行grunt，那么代碼將尋找默認的任務且運行它。
你可以通過簡單的發布一項指令來指定默認的任務
> grunt
指明一個默認的任務，我們簡單的注冊了一個名字為default的任務。
現在我們的Grutnfile看起來如下：
module.exports = function (grunt) { ***javascript*** // Project configuration. grunt.initConfig({ //Lets read the project package.json pkg: grunt.file.readJSON('package.json'), //Some other configs someKey: 'Some Value', author: 'Modulus.io', filePostfix: '-<%= pkg.name %>-<%= pkg.version %>', greetingMessage: 'Running Grunt for project: <%= pkg.name %>, Version: <%= pkg.version %>, Author: <%= author %>. ', //Configure Clean Module clean: { npm: 'npm-debug.log', temp: ['temp', '.tmp'], dist: ['dist', 'out/dist'] } }); // Load the plugin that provides the "clean" task. grunt.loadNpmTasks('grunt-contrib-clean'); //Lets register a basic task. grunt.registerTask('print-info', 'Lets print some info about the project.', function() { grunt.log.write(grunt.config('greetingMessage')).ok(); }); //Specify a custom task which is combination of tasks. grunt.registerTask('my-clean', ['print-info', 'clean:dist', 'clean:npm']); //Specify a default task grunt.registerTask('default', ['my-clean', 'clean:temp']); };
官網：https://gruntjs.com/api/grunt
來源：https://blog.xervo.io/introduction-to-grunt