之前一直聽朋友談起gulp,但沒有使用過，最近有機會接觸到，現在給大家分享下，不對的地方還請指正。我一直以為互相分享是學習的一種好方式。下麵進入正題： 首先來瞭解下gulp,最起碼要知道：我們為什麼要學它，它的優勢。gulp是前端開發過程中對代碼進行構建的工具，它不僅能對網站資源進行優化，在開發過程 ...
之前一直聽朋友談起gulp,但沒有使用過，最近有機會接觸到，現在給大家分享下，不對的地方還請指正。我一直以為互相分享是學習的一種好方式。下麵進入正題：
首先來瞭解下gulp,最起碼要知道：我們為什麼要學它，它的優勢。gulp是前端開發過程中對代碼進行構建的工具，它不僅能對網站資源進行優化，在開發過程中很多重覆的任務能使用正確的工具自動完成；gulp是基於Nodejs的自動任務運行器，借鑒了Unix操作系統的管道（pipe）思想，前一級的輸出，直接變成後一級的輸入，gulp 的流操作，能更快地更便捷地完成構建工作。下麵將學習如何使用gulp。
常用網址：
gulp官方網址：http://gulpjs.com
gulp插件地址：http://gulpjs.com/plugins
gulp 官方API：https://github.com/gulpjs/gulp/blob/master/docs/API.md
gulp 中文API：http://www.ydcss.com/archives/424
使用gulp大致步驟
先談談大致使用gulp的步驟。首先當然是安裝nodejs，通過nodejs的npm全局安裝和項目安裝gulp，其次在項目里安裝所需要的
gulp插件，然後新建gulp的配置文件gulpfile.js並寫好配置信息（定義gulp任務），最後通過命令提示符運行gulp任務即可。
安裝nodejs -> 全局安裝gulp -> 項目安裝gulp以及gulp插件 -> 配置gulpfile.js -> 運行任務
gulp 基於node，在此省略node的安裝，列舉下常用的簡單命令
node -v （查看nodejs版本，確認nodejs安裝正確）
npm -v （查看npm版本，npm和nodejs一起被安裝）
cd （定位到目錄）
dir （列出當前目錄的文件）
cls （清空視窗）
npm介紹
npm（node package manager）nodejs的包管理器，用於node插件管理（包括安裝、卸載、管理依賴等）
使用npm安裝插件：命令提示符執行npm install <name> [-g] [--save-dev]例：npm install gulp-minify-css --save-dev
-g：全局安裝 非全局安裝：將會安裝在當前定位目錄； 全局安裝可以通過命令行在任何地方調用它，本地安裝將安裝在定位目錄的node_modules文件夾下，通過require()調用。
--save：將保存配置信息至package.json（package.json是nodejs項目配置文件）
-dev：保存至package.json的devDependencies節點，不指定-dev將保存至dependencies節點
1.安裝cnpm
npm安裝插件過程：從http://registry.npmjs.org下載對應的插件包（該網站伺服器位於國外，所以經常下載緩慢或出現異常）
因為npm安裝插件是從國外伺服器下載，受網路影響大，可能出現異常，所以npm的伺服器在中國就好了。來自淘寶官網：這是一個完整 npmjs.org 鏡像，但僅限於只讀，官方網址：http://npm.taobao.org
安裝：命令提示符執行npm install cnpm -g --registry=https://registry.npm.taobao.org
註：cnpm跟npm用法完全一致，只是在執行命令時將npm改為cnpm（以下操作將以cnpm代替npm）
2.安裝gulp
全局安裝gulp目的是為了通過它執行gulp任務。
安裝：命令提示符執行cnpm install gulp -g
查看是否正確安裝：命令提示符執行gulp -v，出現版本號即為正確安裝
3.新建package.json文件
說明：package.json是基於nodejs項目必不可少的配置文件，它是存放在項目根目錄的普通json文件
它是類似這樣一個json文件（註意：json文件內是不能寫註釋的）。
可以手動新建這個配置文件，也可以命令提示符執行cnpm init
4.本地安裝gulp插件
安裝：定位目錄命令後提示符執行cnpm install --save-dev
本示例以gulp-less為例（編譯less文件），命令提示符執行cnpm install gulp-less --save-dev
將會安裝在node_modules的gulp-less目錄下，為了能正常使用，我們還得本地安裝gulp：cnpm install gulp --save-dev
5.新建gulpfile.js文件
說明：gulpfile.js是gulp項目的配置文件，是位於項目根目錄的普通js文件（其實將gulpfile.js放入其他文件夾下亦可）它大概是這樣一個js文件
6.運行gulp
說明：命令提示符執行gulp 任務名稱
壓縮css：命令提示符執行gulp cssmin
以上為gulp使用的大致步驟，以及所需安的環境，希望大家可以受益，有問題希望留言。
