gulp是最近火起來的前端構建工具,大有趕超grunt之勢,它和grunt這種構建工具比較像。
grunt是寫一個Gruntfile.js來寫配置代碼,gulp則是寫一個gulpfile.js來寫配置代碼。然后通過命令grunt或者gulp來構建項目,
前端現在三足鼎立的構建工具(不算比較老的ant,yeoman),非fis,grunt,gulp莫屬了。
fis是用起來最簡單的。都不用自己寫什么配置文件。直接執行幾個命令就能把所有東西給你嗖嗖嗖的弄好。難易程度一顆星。
grunt相對來說是最復雜的。Gruntfile.js的配置文件還是有點麻煩,所有代碼都放在在exports函數里面。
等到用了gulp之后你會有一種驚艷的感覺,因為gulp的語法太簡潔了。感覺一句多余的代碼都沒有。或者說它只讓你寫必要的代碼。用gulp官網的話說,這個叫做“代碼優於配置”。而且它里面引用所有的插件都是用的模塊化,自己還支持promise。這一切會讓前端開發感覺逼格更高,用起來更加爽。
grunt的配置文件截圖:
gulp的配置文件:
gulp還讓人有驚喜的一點是構建項目的時間速度快。它充分利用了node流,優化(縮減)了很多對IO的操作。這樣做的好處是你會發現gulp構建的時候每個Tast幾乎都是ms級的,用了這個以后你會感覺grunt構建時候的速度原來那么慢。個人感覺同樣的項目gulp應該只有grunt 1/5的速度吧。
這三個工具都是基於node和npm的。
node也是這兩年前端的新星,它的的高並發處理能力大概也只有nginx能比肩了。雖然一個是程序語言,一個是web服務器,兩者並不是同一物種,但它們最大的優點其實殊途同歸,都是相比較其它語言來說優秀的高並發處理能力。
再說npm。說到npm,我印象最深刻的反而是它的缺點,用它安裝東西的時候超級慢,而且由於npm的服務器是在 國外,所以它的網絡很不穩定,有的時候你會發現中午12點開始用npm安裝一個插件,結果到了下午三四點還沒有裝上。
還好,淘寶弄了個npm的鏡像cnpm。https://npm.taobao.org/ 用這個安裝感覺一開始還是有點慢。但是過了半個鍾頭左右吧就能感覺到安裝速度的明顯提升。
好吧,回到主題gulp,講講它的安裝和使用吧。