gulp串行运行任务问题

项目路径如下：

.
|—— public
|     |__ _common
|__ webapp
|     |—— _common
|     |   |__ js
|     |   |__ less
|     |   |__ tmpl
|     |__ js
|     |__ less
|     |__ tmpl
|__ gulpfile.js

gulpfile代码如下：

var gulp = require('gulp');
var less = require('gulp-less');
var hbsp = require('hbsp');
var concat = require('gulp-concat');
var del = require('del');
var fs = require('fs');
var path = require('path');

var hbsPrecompile = hbsp.precompile;

var publicDir = 'public';
var webappDir = 'webapp';
var cssDir = path.join(webappDir, '/css/');
var commonCssDir = path.join(webappDir, '/_common/css/');

gulp.task('default', ['clean', 'less-common', 'less', 'hbs-common', 'hbs', 'css-common', 'css', 'js-common', 'js']);

gulp.task('clean', function () {
    var dirs = [cssDir, commonCssDir];
    var dir;
    for (var i = 0; i < dirs.length ; i ++) {
        dir = dirs[i];
        if (!fs.existsSync(dir)) {
            fs.mkdir(dir);
        }
        del.sync(dir + '*.css');
    }
});

gulp.task('less-common', function() {
    gulp.src(path.join(webappDir,'/_common/less/', '*.less'))
        .pipe(less())
        .pipe(gulp.dest(commonCssDir));
});

gulp.task("less", function () {
    gulp.src(path.join(webappDir, '/less/', '*.less'))
        .pipe(less())
        .pipe(gulp.dest(cssDir));
});

gulp.task('hbs-common', function() {
    gulp.src(path.join(webappDir, '/_common/tmpl/', '*.tmpl'))
        .pipe(hbsPrecompile())
        .pipe(concat('templates.js'))
        .pipe(gulp.dest(path.join(webappDir, '/_common/js/')));
});

gulp.task('hbs', function () {
    gulp.src(path.join(webappDir,'/tmpl/', '*.tmpl'))
        .pipe(hbsPrecompile())
        .pipe(concat('templates.js'))
        .pipe(gulp.dest(path.join(webappDir, '/js/')));
});

gulp.task('css-common', function () {
    gulp.src(path.join(webappDir, '/_common/css/', '*.css'))
        .pipe(concat('build.css'))
        .pipe(gulp.dest(path.join(publicDir, '/_common/')));
});

gulp.task('css', function () {
    gulp.src(path.join(webappDir, '/css/', '*.css'))
        .pipe(concat('app.css'))
        .pipe(gulp.dest(publicDir));
});

gulp.task('js-common', function () {
    gulp.src(path.join(webappDir, '/_common/js/', '*.js'))
        .pipe(concat('build.js'))
        .pipe(gulp.dest(path.join(publicDir, '/_common/')));
});

gulp.task('js', function () {
    gulp.src(path.join(webappDir, '/js/', '*.js'))
        .pipe(concat('app.js'))
        .pipe(gulp.dest(publicDir));
});

gulpfile中用了gulp.task('default', ['clean', 'less-common', 'less', 'hbs-common', 'hbs', 'css-common', 'css', 'js-common', 'js'])任务依赖的方式来执行任务。但是在使用了gulp命令后，要合并的app.css、build.css并未在指定目录下生成，而且template.js也未在已经合并的app.js中出现。你必须再次手动执行gulp css、gulp css-common、gulp js才可以。
按理说应该会按照给定的依赖关系来执行每个任务，但是上述却出现了问题，自己目前也未找到原因。

---

参考官方文档：https://github.com/gulpjs/gulp/blob/mast...

By default, tasks run with maximum concurrency -- e.g. it launches all the tasks at once and waits for nothing. If you want to create a series where tasks run in a particular order, you need to do two things:

• give it a hint to tell it when the task is done,

• and give it a hint that a task depends on completion of another.

var gulp = require('gulp');

// takes in a callback so the engine knows when it'll be done
gulp.task('one', function(cb) {
    // do stuff -- async or otherwise
    cb(err); // if err is not null and not undefined, the run will stop, and note that it failed
});

// identifies a dependent task must be complete before this one begins
gulp.task('two', ['one'], function() {
    // task 'one' is done now
});

gulp.task('default', ['one', 'two']);

不过gulp@4.0加了series，参考文档：https://github.com/gulpjs/gulp/blob/4.0/...

gulp.task('one', function(done) {
  // do stuff
  done();
});

gulp.task('two', function(done) {
  // do stuff
  done();
});

gulp.task('default', gulp.series('one', 'two', function(done) {
  // do more stuff
  done();
}));