代码之家 › 专栏 › 技术社区 › PatS

gulp.src().pipe().dest()是否在下一行之前完成?我可以多次调用gulp.src().pipe().dest()吗?

gulp promise

0

PatS · 技术社区 · 7 年前

我支持一个使用gulp并试图解决问题的构建过程。为了解决这个问题,我想知道在一个gulp任务中多次调用gulp.src().pipe().dest()的代码是否合法并且正确编写。

更确切地说,我想知道gulp.src().pipe().dest()是否在对gulp.src().pipe().dest()进行另一次调用的下一个javascript行之前完成。

代码如下所示:

gulp.src(getSrcFiles())
    .pipe(dostuff)
    .pipe(dostuff2)
    .dest('temp');
// will the above copy complete before I try doing substitutions 
gulp.src('temp/**')
    .pipe(mySubstitutions)
    .dest('temp')
gulp.src('temp/**')
    .dest('dist')

问题是 gulp.src().pipe().pipe().dest() 在对第一个管道中复制的文件执行某些变量替换的下一行之前完成?

我没看到大口吞咽的文件里的答案 https://gulpjs.org/API.html#gulp-dest-path-options .

我发现其他一些没有回答我的问题是:

One Promise for Multiple Promises - Concurrency Issue
Q.js Promises in Gulp Loop (没有回答,但提出了类似的问题)。
Using Gulp 4 with Promises to Clean/Copy Files
gulp run sequence after promise resolve (类似问题未回答)
How does gulp treat the Promise of a then()? (类似的问题,蟋蟀,没有答案:-)

更多的问题,但没有答案。。。我有一种直觉,我想我会自己回答这个问题,然后我就能回答其他一些问题。

一个很好的问题和答案将帮助我理解gulp以及它如何确保任务的顺序是 What does Gulp "done" method do? . gulp npm运行序列文档也非常有用,请参见 https://www.npmjs.com/package/run-sequence .

最新消息:我发现有人报告这是个问题。

见 https://github.com/gulpjs/gulp/issues/1254

1 回复 | 直到 7 年前

1

PatS 7 年前

这就是我想要的答案:

在下一个javascript行再次调用gulp.src().pipe().dest()之前,将gulp.src().pipe().dest()完成。 不。流管道已启动,但在运行下一个javascript行时不一定完成。
你能用多个吗 gulp.src().pipe().dest() 在一次任务中? 是的,但是你必须用一种特殊的方式来写吞咽任务(如下所示)。

下面的代码演示如何编写一个gulp任务,该任务可以生成几个gulp.src().dest()副本。其工作方式是将gulp.src().pipe()流转换为promise,然后使用promise.all()等待所有流完成,然后再声明gulp任务已完成。

gulp.task('task', function (doneWithTaskCb) {
  return Promise.all([
    new Promise(function(resolve, reject) {
      gulp.src(src + '/*.md')
        .pipe(plugin())
        .on('error', reject)
        .pipe(gulp.dest(dist))
        .on('end', resolve)
    }),
    new Promise(function(resolve, reject) {
      gulp.src(src + '/*.md')
        .pipe(plugin())
        .on('error', reject)
        .pipe(gulp.dest(dist))
        .on('end', resolve)
    })
  ]).then(function () {
    doneWithTaskCb();
  });
});

我没想到。功劳归于泰桑德 https://github.com/gulpjs/gulp/issues/1181#issuecomment-126694791 .

重要的代码是这个模式:

new Promise(function(resolve, reject)  {
    gulp.src()
      .pipe()
      .pipe(gulp.dest(dist))
      .end('end', resolve);
}

这段代码创建了一个承诺,即当它解析管道时,它就完成了。所以从本质上讲,它将“流”转化为承诺。

调用的代码 doneWithTaskCb() 是很重要的,因为这就是gulp知道当前任务完成的方式。

Promise.all( [ new Promise(), new Promise() ] )
    .then(function() { 
        doneWithTaskCb(); 
    });