в gulp-файле вызывается только последний обратный вызов

Question

В gulpfile у меня 3 задачи, когда я запускаю следующий код, он выполняет только обратный вызов последней задачи. Я хочу, чтобы, если я запускаю команду gulp, после завершения задачи clean она выполняла обратный вызов copy: db & default task.

Gulp.task('clean', function () {
    console.log('Clean');
    return Gulp.src("./dbSchema/*")
        .pipe(VinylPaths(Del));
})

Gulp.task('copy:db', Gulp.series("clean"), function () {
    console.log('Copy DB');
    return Gulp.src("./db/*")
        .pipe(Gulp.dest("./dbSchema"));
})

Gulp.task('default', Gulp.series("copy:db"), function () {
    console.log('defaulp');
    return TypeScriptProject.src()
        .pipe(TypeScriptProject())
        .js.pipe(Gulp.dest('dist'));
});

Когда я запускаю команду gulp, она показывает следующий журнал.

[12:46:37] Starting 'default'...
[12:46:37] Starting 'copy:db'...
[12:46:37] Starting 'clean'...
Clean
[12:46:37] Finished 'clean' after 26 ms
[12:46:37] Finished 'copy:db' after 28 ms
[12:46:37] Finished 'default' after 31 ms

Может кто-нибудь сказать мне, где я иду не так?

Answer 1

Чтобы ваш код работал так, как вы описали, функции обратного вызова должны быть переданы в качестве параметра .series(). Например:

Gulp.task('clean', function () {
    console.log('Clean');
    return Gulp.src("./dbSchema/*")
        .pipe(VinylPaths(Del));
})

Gulp.task('copy:db', Gulp.series(clean, function () {
    console.log('Copy DB');
    return Gulp.src("./db/*")
        .pipe(Gulp.dest("./dbSchema"));
}))

Gulp.task('default', Gulp.series(copy:db, function () {
    console.log('defaulp');
    return TypeScriptProject.src()
        .pipe(TypeScriptProject())
        .js.pipe(Gulp.dest('dist'));
}));

---

ИМХО, было бы проще иметь три совершенно разные задачи:

Gulp.task('clean', function () {
    console.log('Clean');
    return Gulp.src("./dbSchema/*")
        .pipe(VinylPaths(Del));
});

Gulp.task('copy:db', function () {
    console.log('Copy DB');
    return Gulp.src("./db/*")
        .pipe(Gulp.dest("./dbSchema"));
});

Gulp.task('default', function () {
    console.log('defaulp');
    return TypeScriptProject.src()
        .pipe(TypeScriptProject())
        .js.pipe(Gulp.dest('dist'));
});

и затем вызывать их с помощью:

Gulp.task('default', gulp.series(clean, copy:db, js));

или

Gulp.task('default', gulp.series(clean, gulp.parallel(copy:db, js)));

Надеюсь, это поможет:)

---

Дополнительные примечания:

1. Соглашение об именах для gulp / vars обычноcamelCase, например: gulp и typeScriptProject, а не Gulp или TypeScriptProject.

2. Вы можете полностью устранить необходимость когда-либо писать gulp., используя: var {gulp, task, src, dest, watch, series, parallel} = require('gulp');

3. Вместо того, чтобы определять свои задачи напрямую, вы можете упростить чтение кода с помощью нотации модуля CommonJS exports для объявления задач.

4. Делает жизнь немного проще, если вы согласны с кавычками, а не смешивать одиночные и двойные. Оба допускают глобализацию

---

Следуя собственной документации Gulp, возможно, стоит начать, их пример кода на github имеет несколько замечательных примеров настройки базового gulpfile.

Если вы заверните все это, вы получите это:

/*
 * Example of requires with gulp methods also requiring gulp.
 */
var { 
    gulp,
    dest,
    series,
    parallel,
    src,
    task,
    watch 
}           = require('gulp'),
vinylPaths  = require('vinyl-paths'), // may not be required, see note in clean func.
del         = require('del'),
ts          = require('gulp-typescript');

/*
 * Added a basic TypeScript Project so the example is complete and could run.
 */
var typeScriptProject = ts.createProject({
    declaration: true
});

/*
 * Your tasks converted to plain/standard js functions.
 */
function clean () {
    return src('dbSchema/*')
        .pipe(vinylPaths(del));

    // Looking at your example code the vinylPaths is redundant,
    // as long as you’re using del ^2.0 it will return its promise,
    // so you could replace the above with:
    return del([ 'dbSchema' ]);
}

function copyDb () {
    return src('db/*')
        .pipe(dest('dbSchema'));
}

function scripts () {
    // example src path
    return src('lib/*.ts')
        .pipe(typeScriptProject())
        .pipe(dest('dist'));
}

/*
 * By defining all the tasks separately it makes it really clear how the tasks will run.
 */
var build = gulp.series (
    clean, 
    gulp.parallel (
        copyDb,
        scripts
    )
);

/*
 * Example of using `exports` module notation to declare tasks.
 */
exports.clean = clean;
exports.copyDb = copyDb;
exports.scripts = scripts;
exports.build = build;

/*
 * Good practise to define the default task as a reference to another task.
 */
exports.default = build;