javascript - run-sequence 不按顺序运行 gulp 任务

Question

我的 Gulp 文件中有 3 个任务必须按以下顺序运行:

1. clean(删除 /dist 文件夹中的所有内容)
2. copy(复制多个文件到/dist文件夹)
3. replace(替换/dist文件夹下部分文件中的部分字符串)

我已经阅读了所有其他帖子，我尝试过“运行顺序”，但它不起作用，因为“替换”任务没有最后运行。我对“回调”的使用感到困惑。单独运行任务效果很好。

var gulp = require('gulp');
var runSequence = require('run-sequence');

gulp.task('runEverything', function(callback) {
    runSequence('clean',
                'copy',
                'replace',
                callback);
});

gulp.task('clean', function () {
    return del(
        'dist/**/*'
    );
});

gulp.task('copy', function() {
    gulp.src('node_modules/bootstrap/dist/**/*')
        .pipe(gulp.dest('dist/vendor'))
    //...
    return gulp.src(['index.html', '404.html', '.htaccess'])
        .pipe(gulp.dest('dist/'));
});

gulp.task('replace', function(){
    gulp.src(['dist/index.php', 'dist/info.php'])
        .pipe(replace('fakedomain.com', 'realdomain.com'))
        .pipe(gulp.dest('dist'));

    return gulp.src(['dist/config.php'])
        .pipe(replace('foo', 'bar'))
        .pipe(gulp.dest('dist'));
});

使用这 3 个任务的完整示例将不胜感激。谢谢。

Answer 1

run-sequence documentation关于异步操作的任务有以下说法:

make sure they either return a stream or promise, or handle the callback

您的copy 和replace 任务都有多个流。您必须返回所有 流，而不仅仅是最后一个。如果您不返回其他流，Gulp 将不会知道它们的任何信息，因此不会等待它们完成。

由于您只能返回一个流，因此您必须合并这些流 [在此处插入捉鬼敢死队引用]。这将为您提供一个合并流，您可以从任务中返回该流。

以下是使用 merge-stream package 的方法:

var merge = require('merge-stream');

gulp.task('copy', function() {
    var stream1 = gulp.src('node_modules/bootstrap/dist/**/*')
        .pipe(gulp.dest('dist/vendor'))
    //...
    var stream2 = gulp.src(['index.html', '404.html', '.htaccess'])
        .pipe(gulp.dest('dist/'));

    return merge(stream1, stream2);
});

gulp.task('replace', function(){
    var stream1 = gulp.src(['dist/index.php', 'dist/info.php'])
        .pipe(replace('fakedomain.com', 'realdomain.com'))
        .pipe(gulp.dest('dist'));

    var stream2 = gulp.src(['dist/config.php'])
        .pipe(replace('foo', 'bar'))
        .pipe(gulp.dest('dist'));

    return merge(stream1, stream2);
});