gulp入坑系列(3)——創建多個gulp.task

    繼續gulp的爬坑路,在準備get更多gulp的具體操作之前,先來明確一下在gulp中創建和使用多個task任務的情況。

    gulp所要做的操作都寫在gulp.task()中,系統有一個默認的default任務,如下:

var gulp = require('gulp');//gulp自身
gulp.task('default',['task1','task2'], function() {
    // 將你的默認的任務代碼放在這
    console.log("default");
});

命令行中的項目根目錄裏執行gulp指令,便會看到default任務被執行,控制檯中輸出了"default"。

那麼如果我們創建多個gulp.task,像下邊這樣:

var gulp = require('gulp');//gulp自身

gulp.task('task1',function () {
    console.log("task1");
});
gulp.task('task2',function () {
    console.log("task2");
})
gulp.task('default', function() {
// 將你的默認的任務代碼放在這
    console.log("default");
});
然後再繼續執行gulp指令,會發現結果如下:

很明顯,之後加的task1和task2並沒有執行,所以說難道gulpfile.js中只支持一個task咩?

嘛,其實這是一個多餘的擔心,我們的代碼只是少了一個步驟

因爲其實在gulpfile.js中,所有操作的入口都是這個叫'default'的task,所以只要將我們自己定義的其他task加入到default中就可以了,修改後代碼如下:

var gulp = require('gulp');//gulp自身
gulp.task('task1',function () {
	console.log("task1");
});
gulp.task('task2',function () {
	console.log("task2");
})
gulp.task('default',['task1','task2'], function() {
	console.log("default");
});

那麼我們再來運行一次gulp指令:

看來是成功了,這裏也可以看到這些task的執行順序,首先依次執行了default中引入的task,最後再執行default自身方法體內的操作。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章