前端自動化構建工具gulp(一)

1.gulp的安裝

建立一個gulp項目

mkdir gulpProject

進入到項目所在文件夾

cd gulpProject

 

首先，要確保安裝了nodejs環境，而後經過nodjs包管理工具npm全局安裝gulp:

npm install -g gulp

全局安裝gulp後，還須要在每一個要使用gulp的項目中都單獨安裝一次。把目錄切換到你的項目文件夾中，而後在命令行中執行：

npm install gulp

若是想在安裝的時候把gulp寫進項目package.json文件的依賴中，則能夠加上--save-dev：

npm install --save-dev gulp

這樣，gulp就安裝完成了。

 

2.開始使用gulp

2.1簡歷gulpfile.js文件

在當前項目下簡歷 gulpfile.js 文件，這是gulp的主文件。下面是一個最簡單的 gulpfile.js 文件內容示例，它定義了一個默認的任務。

var gulp = reuqire('gulp');

gulp.task('defaullt', function() {
    console.log('Hello World!'); 
})    

此時咱們的目錄結構是這樣的：

├── gulpfile.js
├── node_modules
│ └── gulp
└── package.json

2.2運行gulp任務

要運行gulp任務，只需切換到存放gulpfile.js文件的目錄(windows平臺請使用cmd或者Power Shell等工具)，而後在命令行中執行gulp命令就好了，gulp後面能夠加上要執行的任務名，例如gulp task1，若是沒有指定任務名，則會執行任務名爲default的默認任務。