接上篇文章接 "Gulp使用小結(一)" 內容如下： 首先，偶在 "gulp demos" 上已經提交了個較通用的慄子...俺琢磨半天，原準備分階段搞些 套路，但是寫完介個慄子之後，覺得已經能覆蓋絕大多數的場景了(懵逼臉.gif)。算噠，當偶偷懶就醬吧，一個套路打天下:) 然後，聊聊這篇值得思考的文 ...
接上篇文章接Gulp使用小結(一)
內容如下：
首先，偶在gulp-demos上已經提交了個較通用的慄子...俺琢磨半天，原準備分階段搞些 Gulp 套路，但是寫完介個慄子之後，覺得已經能覆蓋絕大多數的場景了(懵逼臉.gif)。算噠，當偶偷懶就醬吧，一個套路打天下:)
然後，聊聊這篇值得思考的文章《我為何放棄Gulp與Grunt，轉投npm scripts》
上
中
下，
英文原地址奉上：《Why I Left Gulp and Grunt for npm Scripts》
最後，偶來分幾個維度扯一下這些構建方式的優劣，尤其是對於 npm scripts。
目錄
《npm scripts》概要
這篇文章在 InfoQ 上被分成了三篇，字數其實不多，且如果您對 npm scripts 不瞭解，很推薦各位去看看，構建的玩法完全不一樣。基本內容如下：
- 第一篇分析
Gulp和Grunt的劣勢。作者忍痛表示各種忍不鳥，主要集中在以下三點： - 問題1 - 對插件作者的依賴
- 問題2 - 令人沮喪的調試
- 問題3 - 脫節的文檔
- 第二篇描述
npm scripts的洪荒之力被低估啦。其實npm scripts是如何強大和好理解，作者羅列了四點Gulp與Grunt如此流行的原因： - 誤解1 - 使用npm scripts需要強大的命令行技巧
- 誤解2 - npm scripts不夠強大
- 誤解3 - Gulp的流對於快速構建來說是不可或缺的
- 誤解4 - npm scripts無法實現跨平臺運行
- 第三篇吐苦水，作者揭示自己在使用
npm scripts過程中遇到的痛點和解決之道。 痛點：JSON規範並不支持註釋，因此無法在package.json中添加註釋。 解決辦法如下： - 編寫小巧、命名良好、單一目的的腳本
- 分離文檔與腳本（比如說放在README.md中）
- 調用單獨的.js文件
閱讀這篇文章引起偶很多共鳴，因為工作中處理的事務較瑣碎(專業打雜)，所以俺對各種技術木有啥傾向性，神馬好用就用神馬，正好 npm scripts 、Gulp、Grunt 都是俺使用過或正在使用的方案，那麼接下來簡單聊聊下偶的觀點。
《npm scripts》觀感簡聊
重點強調一下 —— “存在即合理”。
不管何種技術方案，存在都有其客觀原因（如歷史原因、編碼習慣、虛擬機、分散式、語法糖、編程範型、語言模型等等，要想“編原因”能說的多了去了，勞資越編越高大上有木有），所以建議（更期待）大家以更高的視角去看待這種“某某技術方案更好”的問題，適合項目、適合團隊 才是最重要的。
偶們先看第一篇文章，主要是分析 Gulp 和 Grunt 的劣勢。如果你對 Node 有瞭解，那麼你會發現，作者雖然在吐槽 Gulp/Grunt，但是，其實這些問題都是 Node 正在努力想解決的問題。再俺看來，其實這也可以折射整個 Node 生態略混亂和不標準帶來的影響。
但我們 npm scripts 就可以不用面對這些問題鳥？答：可以少面對，因為至少不用去學習 Gulp 和 Grunt 相關的包，其中很多文檔確實令人著急；但根本問題還是一樣嘛，一樣會遇到 包依賴、調試難、文檔差 的問題
必須得承認 npm scripts 的強大和靈活，它不僅提供了基於約定的pre與post鉤子（PS：鉤子是我眼中 npm scripts 最炫酷的能力），可以使用 Node 生態的一切，更可以使用其他的 Python、PHP、bash 等腳本，給予開發者有更大的施展空間。
下來讓我們通過 執行效率、學習成本、收益 等維度，看看這三種方案的優劣，最終取捨問題就交給各位啦，反正我所在的團隊啥都用:)
再分享幾篇學習 npm scripts 的文章，看完之後你會發現，用其替換 Grunt 和 Gulp 沒那麼簡單，但絕不是太麻煩的事情：
優劣一覽
背景一：按俺這種屌絲的眼光看，《Why I Left Gulp and Grunt for npm Scripts》 的作者 Cory House 是個老外，雖然目前國內前端開發者牛人輩出，與美帝差距不大，但整體水平還是略不如的。其實吧，我想說的是：國內的前端普遍對
bash，Node不熟悉。背景二：“勝過”舊工具的新工具似乎不停的在問世，不經意間就會蹦出個“閃閃亮的”技術來替代另一個，在前端界尤其是這樣。這著實讓其他語言的開發者驚呆了，因為“前端”這個方向已經火爆了那麼久，但是看情況短期內不會消停，各種洪荒之力還在不停的噴涌，景象喜人。
結合這倆個大背景，讓偶們用平和的心態來瞅瞅這倆類(Gulp/Grunt 算一類，npm scripts 算一類)構建工具的優劣吧。
執行效率
效率問題好理解。
Grunt年齡比Gulp稍長，在Github第一次提交時間是2011/09/18)；v0.4.0這個版本開始(2013年2月)，Grunt開始橫掃前端圈Gulp在Github第一次提交時間是2013/06/30，俺是2014/08 第一次使用，那時中文文檔不多，插件也不多
基於“背景二”，“新”工具的產生必然是想革了“舊”工具的命，而且 Gulp 也做到了(尤其在編譯效率方面)。由於 Grunt 的編譯過程大量依賴對文件的 I/O 操作，所以 Grunt 編譯效率遠不如基於 stream 的 Gulp 和 npm scripts；且 Gulp 通過管道(pipe)把各個任務(task)的 輸入/輸出 串起來，讓整個編譯過程更容易理解和維護。
再看 Gulp 和 npm scripts，如果是基於 Node 生態，那麼理論上執行效率半斤八兩，完全依賴對應 Package 的洪荒之力；如果不基於 Node 生態，那麼比起來就木有太多意義啦，全憑工程師的腦洞和能力。
學習成本
首先，Grunt 和 Gulp 都足夠好上手，不需要多先進的理念和經驗，就可以用這倆樣工具構建簡單的前端項目。但是，Gulp 甚至只有幾個 API，這真心夠易學的。
偶上一篇《一》文章說過：“個人覺得玩 Grunt 是種寫配置的感覺；玩Gulp就是寫腳本(task)”。
但是對於 npm scripts 來說，學習成本比上面倆種高了幾何倍。時間有限，有關更多的 npm scripts 俺就不多啰嗦啦，下麵偶簡單羅列下其特點：
- 得熟悉
Node，還有相關的package.json、npm等之類。PS：Grunt和Gulp都是前端的範疇，會不會Node無傷大雅 - 但凡想稍深入一點，就有必要去瞭解
bash。PS：親，npm scripts可不是CLI工具，學會寫Node腳本才僅僅是開始呢:) - 瞭解跨平臺知識~
不要被"學習成本"阻擋，接下來偶來說說收益吧。技術的積累肯定都是有用的嘛，比如用來：裝逼...
個人收益
收益問題就比較現實了。花了時間去學去研究，光收穫成就感可不行，實際收益也要能體現才好是吧，所以嘛...讓我們幹了這碗雞湯。
{% highlight Delphi %}
少年苦練 10 年拳術欲下山揚名立萬，路遇一使刀漢子，數招後不敵慘敗而歸……回山後找師傅問話
“師傅，為何我苦練十年還會輸？”
“因為你不知道打架不止可以用拳頭。”
“可你也沒告訴我啊！”
“你只說要學拳法，又沒說學打架！”
“那我不學拳法了，我要學打架！”
“那就不只是要學拳法了，打架想要贏就得十八般武藝都學，你未必要門門精通，但你最起碼得有這些見識。除此之外，還得學挨打，學療傷，學逃跑，學追蹤，學暗器，學使毒……想贏？哪有那麼簡單的！”
“那我還能成拳法宗師嗎？”
“呵呵，如果你打架再也不會輸，誰敢說你不是宗師？”
{% endhighlight %}
夢想總是要有的，萬一遇見了鬼呢...
不對不對，萬一哪天偶們成為了宗師呢，對吧~
多人 VS 單干
我們再看個更現實的問題 —— 多人開發/獨立開發。
單干
- 技術瓶頸就是自己
- 開發和部署的環境較隨意，反正坑的是自己。PS：各種配環境真的是大團隊里的惡魔
- 文檔那都不叫問題，肯寫幾句代碼註釋給自己和後來人看，這就已經夠意思了
多人
- 如何統一技術棧？人人都會
Node比較難，人人都懂shell就更難了，但是人人都能玩轉Gulp就簡單的多了，只要懂JavaScript就行鳥 - 開發環境和生成環境得嚴謹起來啦，而且但凡要考慮跨平臺，
npm scripts強大的洪荒之力會被壓制，而且真要對面這個問題，光屢文檔就得忙一陣 - 請記住，文檔是項目和團隊的傳承...哦對了，
package.json是JSON格式，不支持寫註釋哦...我想罵髒話：#&！#@#@*#！@#（#*#￥
所以，老夫的建議是：請使用 適合 的技術。
小結
當前 3.9.1 版本的
Gulp API確實足夠簡單易懂，但 4.0 版本新增了數個API。有關新API的內容就不說明鳥，Changelog地址：CHANGELOG.md
但是！特麽去年勞資就等著這個 4.0，現在已經2016年的6月了，這個 4.0 還特麽沒有出來...
Grunt的優勢是插件夠齊全，開發中需要的插件都能找到，且足夠易學好上手；缺點是可讀性差強人意，編譯效率略低，項目越大劣勢會越明顯。PS：插件數5734(2016/06/01記錄)Gulp作為Grunt的顛覆者，確實更簡單、更好上手，stream的特點也更符合技術趨勢，而且編譯的效率更優；不過插件數相對Grunt略少。PS：插件數2432(2016/06/01記錄)
更多有關 Grunt 對比 Gulp，推薦閱讀：Gulp vs Grunt PS：這文章貌似我多次推薦，但俺真沒收好處費:)
學習成本較高可能是 npm scripts 最大的問題了；其次就是跨平臺會比較麻煩。
其實我覺得使用 npm scripts 最大的好處就是沒有“束縛”！！！
不管上面兩種方案做到瞭如何美好和抽象，其實都是 Node 能力的具體落地，所有的一切都背靠整個 Node 生態完成（PS：當然，偶們得肯定 Gulp 和 Grunt 的價值與意義）。
但如果到了 npm scripts，您等於擁有了操作系統的一切。npm scripts 可以執行 shell，shell 里可以是 Node 程式，甚至是 PHP、Ruby、bash 等等能執行的一切，能玩出什麼花樣就看自己的腦洞有多大了:)
比如在我司，部署/回滾 上線環境和測試環境，測試用例，後門調試等，都是用 npm scripts 幾行代碼搞定。
不美好的Node
最後，因為想說說 包依賴 這個事情，所以在這容我多聊五毛錢的 Node，火熱無比的它確實不是那麼美好(PS：當然不會存在完美的語言嘛)。
經過了 JavaScript 和本身版本號的野蠻生長，略混亂的生態也讓不少開發者吃到了苦頭。說倆事情：
- 善變的標準
ES5還是ES2015(就是ES6)？如果你還不知道指針函數、模板字元串、Set/Map數據結構等等，真心看不懂現在新興的前端項目。又怎麼去解決callback？是Promise、Async、Generator還是其他...如果你不去追最新的標準，分分鐘就被現在的年輕人弔打呀:) - 包依賴 數月前
left-pad事件(一個名字引發的血案，感興趣的同學請自行搜索)，硬是搞得NPM升級了移除包的規則。升級內容的中文版奉上：Npm更新移除包的規。這一段幾次寫了刪、刪了寫，吐槽和抱怨不適合我這種陽光 boy。。。算了，都刪掉~~貼張國外很火的圖片來讓大家開心一下吧：
因為這些構建工具，前端有了自動持續化的構建過程，越來越多美好的事務正在發生...
有關 Gulp 就說到這吧。我水完了，謝謝:)
