《JavaScript開發架構權威指南》——2.2 Grunt是如何工作的

本節書摘來自異步社群《javascript開發架構權威指南》一書中的第2章，第2.2節，作者：【美】tim ambler , nicholas cloud著，更多章節内容可以通路雲栖社群“異步社群”公衆号檢視

grunt為開發者提供了一個工具包，用于建立指令行程式來執行項目建構過程中的重複性任務，如壓縮javascript代碼、編譯sass樣式表等。不過，grunt的能力并不限于建立簡單的任務（通常這些任務不會被分享或者複用），以解決特定工程遇到的特定需求，其真正的力量源于其将任務打包為可複用的插件的能力。這些插件可以被釋出、分享、使用以及由其他人進行改進。本書寫作之時已經有超過4 400個這樣的插件。

grunt的運轉依賴于四個核心元件，接下來逐一論述。

2.2.1　gruntfile.js

在grunt中處于核心地位的是gruntfile——一個位于工程根目錄下的名為gruntfile.js（見清單）的node子產品。正是這個檔案使得我們可以加載grunt插件，建立自定義任務，并根據項目需求對它們進行配置。grunt每次運作時的首要任務都是接受該子產品發出的指令。

清單2-2　gruntfile示例

2.2.2　任務（tasks）

作為grunt的基本構模組化塊，任務實際上隻是由grunt的registertask()方法注冊的具名函數。清單所示的hello-world任務将向控制台輸出一條消息。在指令行中調用該任務的結果，如清單所示。

清單2-3　運作清單中所示的hello-world任務

如清單所示，多個grunt任務也可以由單條指令調用執行。每個任務都将按照參數的傳入順序依次執行。

清單2-4　順序運作多個任務

我們剛看到的hello-world任務是簡單獨立型grunt任務的代表。這樣的任務可以用于實作一些簡單的功能，以解決特定項目的需求。通常我們不會考慮其複用或者分享的問題。但是多數時候，你會發現我們實際用到的都不是這樣的獨立型任務，而是那些已經打包為grunt插件并釋出到npm的任務。以插件的形式釋出更便于别人使用或者參與改進。

2.2.3　插件（plugins）

grunt插件是一系列能夠用于不同項目的可配置任務（以npm包的形式釋出）的集合。現存的grunt插件數以千計，可謂洋洋大觀。清單中的grunt方法loadnpmtasks()用以加載名為grunt-contrib-uglify的node子產品。該子產品可以将工程中的javascript代碼合并為單個壓縮（minified）檔案，以适應釋出需求。

2.2.4　配置

grunt以強調“配置優先”（configuration over code）而著稱：任務和插件的功能均可通過配置檔案進行定制，以适應不同工程的需求。正是這種代碼與配置分離的特性，使開發者能夠創造出容易被複用的插件。本章稍後将介紹配置grunt插件和任務的各種不同的方法。