gulp是用來幹什麼的？（概念）

 

當咱們在使用gulp的時候，gulp到底用來幹什麼呢？

1. 編譯 sass
2. 合併優化壓縮 css
3. 校驗壓縮 js
4. 優化圖片
5. 添加文件指紋（md5）
6. 組件化頭部底部（include html）
7. 實時自動刷新…
8. ......
9. 壓縮靜態資源
10. 變動靜態資源
11. 給靜態資源添加 md5
12. 修改預處理樣式後自動編譯（SASS，Less）
13. 合併雪碧圖
14. 自動刷新瀏覽器
15. ......
16. Sass編譯
17. Css Js 圖片壓縮
18. Css Js 合併
19. Css Js 內聯
20. Html的include功能
21. Autoprefixer
22. 自動刷新
23. 去緩存
24. Handlebars模板文件的預編譯
25. 雪碧圖
26. ESLint
27. rem移動端適配方案

 

總之，gulp是前端開發過程當中對代碼進行自動化構建的利器。它不只能對資源進行優化，並且在開發過程當中可以經過配置自動完成不少重複的任務，讓咱們能夠專一於代碼，提升工做效率。

 

然而因爲衆所周知的緣由，國內到 npm 服務器的鏈接很不穩定，若是你有V了個PN大可沒必要擔憂，也可經過設置 npm 代理服務器的方式訪問：

// 設置代理
npm config set proxy="http://127.0.0.1:1080"
// 刪除代理
npm config delete proxy

 

推薦一個簡單的方案：使用淘寶 npm 鏡像 

「這是一個完整 npmjs.org 鏡像，你能夠用此代替官方版本(只讀)，同步頻率目前爲 10分鐘 一次以保證儘可能與官方服務同步。」 —— 淘寶團隊點贊

npm config set registry="https://registry.npm.taobao.org"
npm config set disturl https://npm.taobao.org/dist

如上設置完npm淘寶鏡像的話，以後的命令使用仍是使用的npm而不是現編的使用cnpm來代替npm

固然你也能夠執行以下的命令：

npm install cnpm -g --registry=https://registry.npm.taobao.org

直接使用cnpm代替npm裏操做！

 

初步準備工做準備完畢，接下來 gulp 教程了：參考上一篇隨筆