Grunt備忘錄

1、安裝Grunt

應在全局環境下安裝Grunt，以保障在任何目錄下都可以正確找到grunt

npm install grunt-cli -g

 

2、對已有Grunt基本目錄結構文件進行操做

Grunt須要的基本文件有：

1. Gruntfile.js。Grunt須要的基本配置文件。該文檔標識了執行grunt命令時會執行的內容。
2. package.json。實際爲node.js的當前project信息配置文件，特別是其中的包依賴dependencies很是重要。每次npm install實際上都是對其的從新pull及更新。

關於基本文件Gruntfile.js的詳細教程參考http://www.gruntjs.org/article/sample_gruntfile.html

若當前目錄已知足條件，在開發時進行以下步驟便可：

1.npm install （grunt --save -dev）

括號內容可省略。根據package.json的內容安裝或更新依賴包。其中的grunt --save -dev實際上時調用grunt，將變動的依賴信息自動加入到基本文件中，不然須要手動更新。

2.grunt

執行grunt使得grunt插件，如concat、jshint等生效。執行過程會找到default自動執行裏面的內容。具體原理參考上文提供的詳細教程。

執行前應注意gruntfile中的default指向序列，防止出錯。

3.grunt watch

watch爲grunt的一個插件，須要在以前的步驟中隨其餘插件預先配置安裝。即在grunt基本穩健配置時就應已經配置好。具體插件的安裝方法在後續的「空目錄初始化」部分會介紹到。

在對project進行任何修改操做前，應先運行watch監控代碼，watch會對監控的代碼的任何修改自動進行指定步驟，其配置文件在gruntfile中。

4.ctrl +c

在代碼編輯完後，應先退出watch，而後進行正常的代碼提交。

 

3、Grunt目錄初始化

第一種方法

如第二部分所示，grunt目錄的基本結構至少包含兩個文件，這兩個文件是能夠手動配置的，具體仍可參考上文第一部分給出的連接。這裏說一下如何自動化生成該目錄。

Grunt自己包含四種默認的模板，即gruntfile、commonjs、jquery、node，具體詳見http://www.cnblogs.com/lhb25/archive/2013/01/24/grunt-for-javascript-project-a.html

1. npm install grunt -init -g

全局安裝grunt默認模板。

2. grunt-init gruntfile

第二種方法

對於工程目錄的初始化也能夠採用如下方式：

grunt init:gruntflie

進入空的工程目錄，對該目錄使用默認模板gruntfile進行初始化。初始化完畢後能夠發現目錄下多了兩個基本文件。

初始化目錄後，因爲已經存在基本結構，因此能夠針對基本結構進行自行修改。後續操做能夠參考第二部分。

 

//初學grunt，若有錯誤請指出，謝謝。