切圖崽的自我修養－使用自動化工具

前言

F5已爛

想來你們對自動化構建工具已經不陌生了，自動化構建工具能夠幫開發者省去不少重複勞動好比:語法糾錯、文件打包、文件操做，合併壓縮等等. 經常使用的自動化構建工具備Gulp,Grunt,Fis等等，這些構建工具核心都是依賴第三方插件，經過顆粒化任務，再將這些任務按照合適的方式進行組合，構建項目所需的自動化工做流

---

經常使用插件

這裏來簡單來講明一下Grunt的最經常使用的幾個插件:

• grunt-include-replace-more 能夠對項目中的html進行模版化配置

• grunt-contrib-jshint 能夠對項目中的Js文件進行語法檢查

• grunt-contrib-uglify 能夠對項目中的Js文件進行壓縮

• grunt-cmd-transport 將匿名Js模塊具名化

• grunt-cmd-concat 按需合併Js模塊

• grunt-contrib-compass 能夠將項目中的Sass文件編譯成css

• grunt-inline 能夠將項目中標示了_inline的資源經過內聯的方式引入

• grunt-contrib-imagemin 能夠對項目中的Img進行壓縮

• grunt-contrib-watch 監聽項目中的文件狀態，若是文件被改變，則從新構建

• grunt-contrib-copy 複製文件到某個目錄

• grunt-contrib-clean 刪除某個文件

---

結語:

以上是Grunt的最基本最經常使用的幾個插件. 其中較難使用的是如何合併Js模塊，
也就是如何整合 grunt-cmd-transport, grunt-cmd-concat 的使用. 這裏又要牽扯到Seajs匿名模塊，具名模塊和ID即路徑的問題, 這裏放到模塊化Js的章節裏說吧

(有興趣的同窗能夠移步Grunt官網 享受自動構建的快感)