gulp初印象

 

幾個月前三木君向我推薦過gulp，到如今由於工做須要才接觸到它，真的很慚愧，在此記錄下對gulp的初印象。

全局安裝：

$ npm install –global gulp

一個gulpfile.js文件：

這個文件須要在項目的根目錄下建立。默認任務（什麼也不作）：

1. var gulp = require('gulp');
2. gulp.task('default', function() {
3. // place code for your default task here
4. });

下面的命令將執行這個任務：

$gulp

來看看gulp的API！

分爲四個大的部分：

• gulp.src：定義被操做的源文件（可用*來指定目錄、文件類型）

• gulp.task：定義任務，例如壓縮、優化、編譯等等

• gulp.dest：在指定目錄寫入（執行任務後）生成的文件

• gulp.watch：當一個文件被修改時，執行某個任務

*簡單來講就是：哪些文件（src）？進行怎樣的操做（task）？結果寫到哪兒、怎麼寫入（dest）？而後，爲了方便咱們專心編碼，讓watch來自動監測一切變化吧。

舉個例子：

建立一個監聽全部類型爲less的文件的任務，當任何一個less文件被修改時，執行less-pro這個任務。*

1. gulp.task('watch-less', function () {
2. gulp.watch('less/*.less', ['less-pro']);
3. });

 

less-pro任務片斷以下：

1. gulp.task('watch-less', function () {
2. gulp.watch('less/*.less', ['less-pro']);
3. });

 

如上watch less的例子中，執行：

$ gulp watch-less

就能夠自動監控全部less文件的改變並進行編譯。

全文連接：http://www.gbtags.com/gb/share/5697.htm