如果是新手就請先看完全篇文章再開始動手操作，否則中間遺漏了什麼細節的話有可能導致安裝失敗或者安裝後測試時出現找不到檔案的尷尬。

相信大家再寫程式碼的時候或多或少都會遇到一個問題，比如css檔案中，某一些引數因為一些不可避免的原因需要改動，而改動的引數內容時是完全一樣的，但是卻不是在同一個地方，而且css檔案篇幅很長。這是你就會存在一種無法言語的難受。那麼接下來我們就一起學習一種減輕你負擔的方法。

大家都知道gulp好用，可是就時安裝的時候很煩人，本人通過反覆的實驗之後總結了以下幾點：

1.安裝node.js：

有的人就在想，我要安裝的是gulp，你給我說node.js幹嘛？

舉個簡單的例子。我們日常生活中都要做飯、吃飯。而node就像是做飯用的灶臺（能量來源）。gulp就像是廚具。而gulp的功能性外掛就像是餐具（本文以less為例）

因此我們要先安裝node.js;

2.安裝gulp：

文中會有兩次提到安裝gulp。

a.全域性安裝；

b.非全域性安裝。

3.新建package.json檔案（重要）

4.安裝需要的對應模組。

5.建立gulpfile.js檔案（重要）

6.開始使用。

==============================這是一條分割線==============================================

1.下載node.js

官網頁面：https://nodejs.org/en/   點選開啟連結

官網裡面就有點選下載的顯眼按鈕，點就下載就好了

2.安裝node.js後

我們開啟cmd

這時我們輸入 node -v  以及  npm -v  檢查是否安裝成功。

確保出現版本號之後我們繼續操作。

3.為了提高後續使用的快速，我們安裝一個cnpm。

什麼是cnpm？簡單的來說就是把國外的npm完全映照在國內

這就是映象的cnpm。內容會不斷的同步npm的內容。

至於怎麼安裝請跳轉：http://blog.csdn.net/qq_38712750/article/details/71750734點選開啟連結

4.安裝好了之後我們開始進入今天的正題gulp的安裝使用；

輸入安裝命令 cnpm install gulp-g          注意這裡的-g 是全域性安裝

安裝好後檢視是否安裝成功（用檢視版本號的方法）輸入 gulp -v

然後進入下一步

5.新建package.json檔案

在這之前我們先要跳轉到想存放的檔案目錄中

確定跳轉成功後接著輸入：cnpm init

輸入關鍵內容：

填寫完後一定要確認內容

最後確認生成package.json檔案

先檢查一下，成功生成檔案後繼續下一步

6.安裝less：輸入cnpm install gulp-less --save-dev  以及cnpm install gulp --save-dev注意這裡不是全域性安裝

--save：將儲存配置資訊至package.json（package.json是nodejs專案配置檔案）；

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

接著檢查package.josn檔案裡是否存在安裝的內容（12，13），沒有的話要手動新增。

7.建立gulpfile.js檔案內容如下：（第一次輸入最好手打  提高印象）

一定要注意的是圖中標記的路徑以及檔名是可變的。

特別是less檔名，如果不想那麼麻煩就直接用 ‘*’（星號代替） 代替；

然後就完成了一系列安裝。

建立less檔案後

開始測試，過程就用圖片說明吧。

最後來個效果圖

特別鳴謝：

參考內容來源：http://www.ydcss.com/archives/18 點選開啟連結