什么是GULP
GULP是前端開發(fā)過程中對代碼進(jìn)行構(gòu)建的工具蔬充，是自動化項目的構(gòu)建利器亭罪；她不僅能對網(wǎng)站資源進(jìn)行優(yōu)化弧蝇，而且在開發(fā)過程中很多重復(fù)的任務(wù)能夠使用正確的工具自動完成歧沪；使用她歹撒，我們不僅可以很愉快的編寫代碼，而且大大提高我們的工作效率诊胞。GULP 是 基 于 Nodejs 的 自 動 任 務(wù) 運(yùn) 行 器 暖夭， 她 能 自 動 化 地 完 成javascript/coffee/sass/less/html/image/css? 等文件的的測試、檢查撵孤、合并迈着、壓縮、格式化邪码、瀏覽器自動刷新裕菠、部署文件生成，并監(jiān)聽文件在改動后重復(fù)指定的這些步驟闭专。
在實現(xiàn)上糕韧，她借鑒了Unix操作系統(tǒng)的管道（pipe）思想，前一級的輸出喻圃，直接變成后一級的輸入萤彩，使得在操作上非常簡單。gulp 和? grunt 非常類似斧拍，但相比于? grunt 的頻繁? IO? 操作雀扶，gulp 的流操作，能更快地更便捷地完成構(gòu)建工作肆汹。
安裝gulp
Gulp是基于node.js環(huán)境運(yùn)行的愚墓，所以我們首先需要安裝node.js環(huán)境。
Node.js的安裝
1. 下載nodejs安裝包? 到nodejs官網(wǎng)下載軟件? https://nodejs.org
2. 安裝Nodejs
在Window系統(tǒng)中直接下一步下一步式安裝昂勉。安裝好后WIN+R輸入cmd調(diào)出DOS窗口浪册，輸入node -v看看是否有版本信息，如果沒有則查看系統(tǒng)變量Path岗照，把path配置上去村象。
如果出現(xiàn)版本號就說明已經(jīng)成功了笆环。
3. 推薦安裝 cnpm
npm服務(wù)器在國外，網(wǎng)絡(luò)影響大厚者，甚至還會遇到需要翻墻才能下載插件的情況躁劣，因此推薦安裝cnpm。注：cnpm跟npm用法完全一致库菲，只是在執(zhí)行命令時將npm改為cnpm账忘。后面的演示均使用cnpm【淘寶npm鏡像，這是一個完整? npmjs.org? 鏡像熙宇，你可以用此代替官方版本(只讀)鳖擒，同步頻率目前為? 10 分鐘? 一次以保證盡量與官方服務(wù)同步】。? 鏡像地址：http://npm.taobao.org/
3.1 安裝cnpm
執(zhí)行 npm install cnpm -g --registry=https://registry.npm.taobao.org
3.2 檢測cnpm是否安裝成功
執(zhí)行cnpm -v 顯示版本號即安裝成功
gulp的安裝
全局安裝gulp
打開Node.js command prompt 或者cmd命令提示符烫止，輸入命令：npm install –g gulp然后輸入gulp -v败去，看看是否有版本信息。
項目文件根目錄新建package.json
注：package.json是基于nodejs項目必不可少的配置文件烈拒，它是存放在項目根目錄的普通json文件重點內(nèi)容
?? 進(jìn)入你的項目文件
示例：進(jìn)入? D:/WWW/test 項目文件夾中
gulp安裝教程，使用教程广鳍，簡單的自動化任務(wù)教程
執(zhí)行命令? cnpm init 來新建package.json
gulp安裝教程荆几，使用教程，簡單的自動化任務(wù)教程
檢測package.json是否成功新建
查看項目文件根目錄赊时，是否新建package.json吨铸，且內(nèi)容是否和你終端中輸入的一致。
注：可不使用cnpm init方式祖秒，可選擇手動創(chuàng)建package.json配置文件
本地安裝gulp
建立項目诞吱，創(chuàng)建gulpfile.js和package.json文件。運(yùn)行命令cnpm install gulp --save-dev安裝本地gulp竭缝。
gulp的實施與使用
創(chuàng)建工作目錄與發(fā)布目錄
工作目錄：即沒有經(jīng)過壓縮合并等處理的文件存放目錄房维。
發(fā)布目錄：即項目發(fā)布所引用的文件目錄地址，這里的文件是經(jīng)過gulp壓縮合并等處理
后生成的文件抬纸，處理過后的名字可以自定義咙俩，也可以不處理即與未處理文件名相同。
