windows下零基礎gulp構建

在學習前，先談談大體使用gulp的步驟，給讀者以初步的認識。首先固然是安裝nodejs，經過nodejs的npm全局安裝和項目安裝gulp，其次在項目裏安裝所須要的gulp插件，而後新建gulp的配置文件gulpfile.js並寫好配置信息（定義gulp任務），最後經過命令提示符運行gulp任務便可。

安裝nodejs -> 全局安裝gulp -> 項目安裝gulp以及gulp插件 -> 配置gulpfile.js -> 運行任務

一、安裝nodejs　　

gulp是基於nodejs，理所固然須要安裝nodejs

二、使用命令行

簡單介紹gulp在使用過程當中經常使用命令，打開命令提示符執行下列命令（打開方式：window + r 輸入cmd回車）：

node -v查看安裝的nodejs版本，出現版本號，說明剛剛已正確安裝nodejs。PS：未能出現版本號，請嘗試註銷電腦重試；

npm -v查看npm的版本號，npm是在安裝nodejs時一同安裝的nodejs包管理器，

cd定位到目錄，用法：cd + 路徑 ；

dir列出文件列表；

cls清空命令提示符窗口內容。

三、npm介紹

說明：npm（node package manager）nodejs的包管理器，用於node插件管理（包括安裝、卸載、管理依賴等）；

使用npm安裝插件：命令提示符執行npm install <name> [-g] [--save-dev]；

<name>：node插件名稱。例：npm install gulp-less --save-dev

-g：全局安裝。將會安裝在C:\Users\Administrator\AppData\Roaming\npm，而且寫入系統環境變量；  非全局安裝：將會安裝在當前定位目錄；  全局安裝能夠經過命令行在任何地方調用它，本地安裝將安裝在定位目錄的node_modules文件夾下，經過require()調用；

--save：將保存配置信息至package.json（package.json是nodejs項目配置文件）

-dev：保存至package.json的devDependencies節點，不指定-dev將保存至dependencies節點；通常保存在dependencies的像這些express/ejs/body-parser等等。

爲何要保存至package.json？由於node插件包相對來講很是龐大，因此不加入版本管理，將配置信息寫入package.json並將其加入版本管理，其餘開發者對應下載便可（命令提示符執行npm install，則會根據package.json下載全部須要的包，npm install --production只下載dependencies節點的包）。

四、選裝cnpm

官方網址：http://npm.taobao.org；

安裝：命令提示符執行npm install cnpm -g --registry=https://registry.npm.taobao.org；  注意：安裝完後最好查看其版本號cnpm -v或關閉命令提示符從新打開，安裝完直接使用有可能會出現錯誤；

注：cnpm跟npm用法徹底一致，只是在執行命令時將npm改成cnpm（如下操做將以cnpm代替npm）。

五、全局安裝gulp

說明：全局安裝gulp目的是爲了經過她執行gulp任務；

安裝：命令提示符執行cnpm install gulp -g

查看是否正確安裝：命令提示符執行gulp -v，出現版本號即爲正確安裝。

六、新建package.json文件

說明：package.json是基於nodejs項目必不可少的配置文件，它是存放在項目根目錄的普通json文件；

命令提示符執行cnpm init   直接安裝

七、本地安裝gulp插件

安裝：定位目錄命令後提示符執行cnpm install --save-dev；

 

 

九、運行gulp

命令提示符執行gulp 任務名稱；