gulp使用入門

介紹：Gulp 是基於node.js的一個前端自動化構建工具，可使用它構建自動化工做流程（前端集成開發環境）；不只能對網站資源進行優化，並且在開發過程當中不少重複的任務可以使用正確的工具自動完成，大大提升咱們的工做效率。

gulp的相關文件壓縮在下一節， 傳送

 

---

初步嘗試：

一、安裝gulp ，在安裝gulp以前要先安裝node ， 點這裏下載

 （當前是win，mac用戶加sudo） 

npm install gulp -g //全局安裝gulp

二、建立gulp項目

 進入項目目錄，在跟目錄下執行

npm init    建立一個packpage.json文件   json文件裏沒有註釋

根據命令提示，設置json參數


{

  "name": "test",   //項目名稱（必須）

  "version": "1.0.0",   //項目版本（必須）

  "description": "This is for study gulp project !",   //項目描述（必須）

  "homepage": "",   //項目主頁

  "repository": {    //項目資源庫

    "type": "git",

    "url": "https://git.oschina.net/xxxx"

  },

  "author": {    //項目做者信息

    "name": "simbals",

    "email": "*******@qq.com"

  },

  "license": "ISC",    //項目許可協議

  "devDependencies": {    //項目依賴的插件

    "gulp": "^3.8.11",

    "gulp-less": "^3.0.0"

  }

}

　　

三、局部安裝gulp

npm install gulp --save-dev 

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

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

　　使用—save-dev，將通知計算機在package.json中添加gulp依賴。 執行完以後，gulp將建立node_modules文件夾，裏面有個gulp文件夾(以下圖）

　　

四、根目錄下建立gulpfile.js文件

var gulp = require('gulp');  //Node去node_modules中查找gulp包
gulp.task('hello', function() {  //命名一個簡單任務
  console.log('Hello World!');
});

五、執行gulp任務

 gulp hello  // hello 是任務名  

　命令行出現 ：

Hello World!