Gulp-将path数组传递给任务运行，但只有最后一个任务按预期完成 [英] Gulp - passing a paths array to tasks runs but only the last task completes as expected

问题描述

下面的这个小片段试图将两个项目 projA 和 projB 从它们的文件夹复制到gulp文件夹中.它通过数组传递两个文件夹的路径.该代码可以正确执行，但只能执行数组中的最后一个路径.因此，仅复制 projB .

This small snippet below attempts to copy two projects, projA and projB from their folders into the gulp folder. It passes the paths for the two folders via an array. The code executes correctly but only the last path in the array. So only projB is copied over.

`const gulp = require('gulp');`

`var pathsToProj = [        // source               // base              destination
                ['../../projA/eb_aws/**/*.*', 'projA/eb_aws', 'gulp-proj1/src/projA/eb_aws'],
                ['../../projB/eb_aws/**/*.*', 'projB/eb_aws', 'gulp-proj1/src/projB/eb_aws'],
              ];    

    pathsToProj.forEach(pathToProj => {`

        gulp.task('copyFiles', function(){
            return gulp.src(pathToProj[0], {base: pathToProj[1]})
                .pipe(gulp.dest(pathToProj[2]));
        });

        gulp.task('default', gulp.series('copyFiles', async function (cb){
            cb();   
        }));
    });

另一个异常是项目文件夹被复制到/gulp-proj1/(/gulp/proj1/projB )而不是复制到/gulp-proj1/src/如我所愿.

Another anomaly is that the project folder is copied to /gulp-proj1/ (/gulp/proj1/projB) and not to /gulp-proj1/src/ as I intended it to be.

感谢您为解决此问题提供的任何帮助.谢谢.

Any help to resolve this is appreciated. Thanks.

推荐答案

这是由于 forEach 和gulp的异步特性的结合. forEach 可以快速循环-无需等待其中的每个功能完成.因此，在第一个 copyFile 完成之前，将再次调用它，这将重新启动任务，并且通常仅最后一个完成.这完全取决于内部任务执行的速度或速度，这是不好的.该内部功能应该是同步的，以确保其达到您的期望.

It is because of the combination of forEach and gulp's asynchronous nature. The forEach's will quickly cycle through - without waiting for each function within to complete. So before the first copyFile completes it is called again, which restarts the task and only the last one typically completes. It is entirely dependent on how fast or slow your internal task takes which is not good. That internal function should be synchronous to ensure it does what you expect.

有关进一步的讨论，请参见例如将async/await与forEach一起使用循环等.另请参阅 MDN forEach :

For further discussion, see, e.g., Using async/await with a forEach loop and similar. Also see MDN forEach:

forEach希望有一个同步功能

forEach不等待承诺.请确保您知道将promise(或异步函数)用作forEach时的含义回调.

forEach does not wait for promises. Kindly make sure you are aware of the implications while using promises(or async functions) as forEach callback.

因此，基本上任何其他 for 类型循环都可以使用.这是可以使用的代码的简单得多的版本:

So basically any other for type loop would work. Here is a much simpler version of your code that works:

// gulp.task('copyFiles', function (cb) {
function copyFiles(cb) {

  for (const pathToProj of pathsToProj) {

    gulp.src(pathToProj[0])
      .pipe(gulp.dest(pathToProj[1]));
  };
  cb();
};

gulp.task('default', gulp.series(copyFiles));

出于测试目的，我只关注这个问题，而不是关于目标文件夹的第二个问题.

Note for testing purposes I focused on this one issue and not your second question about the destination folder.

这篇关于Gulp-将path数组传递给任务运行，但只有最后一个任务按预期完成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！