从对象中的条目动态生成 Gulp 4 个任务

Question

我正在尝试为对象中的每个条目动态生成 Gulp 4 个任务。

该对象包含包名称和要包含在包中的文件数组。

看起来像这样：

const scripts = {
    dest: 'dist/js/',
    bundles: {
        'main': [
            'src/js/script-1.js',
            'src/js/script-2.js',
        ],
        'vendor': [
            'src/js/script-3.js'
        ]
    }
};

我想为 "bundles" 对象中的每个条目创建两个 gulp 任务，一个用于构建脚本，一个用于监视更改。

这是我目前的情况：

for (const [name, files] of Object.entries(scripts.bundles)) {

    const buildTaskName = 'build:' + name;
    const watchTaskName = 'watch:' + name;

    gulp.task(buildTaskName, function() {
            return gulp.src(files)
                       .pipe(sourcemaps.init())
                       ... Plugins Here ...
                       .pipe(sourcemaps.write('.'))
                       .pipe(gulp.dest(scripts.dest))   
    });

    gulp.task(watchTaskName, function() {
        gulp.watch(files, buildTaskName)
    });
};

当我运行 gulp build:main 任务运行时，我在 dist 文件夹中得到一个名为 main.min.js 的新文件。

然而，当我运行 gulp watch:main 我得到他的错误：

Error: watching src/js/script-1.js,src/js/script-2.js: watch task has to be a function 
(optionally generated by using gulp.parallel or gulp.series)

我不确定为什么构建任务有效，但监视任务无效。任何帮助将不胜感激。

Answer 1

根据，在 Gulp 4 中，您必须将函数传递给 gulp.watch，而不仅仅是函数名称...

通过将监视任务更改为：

gulp.task(watchTaskName, function() {
    return gulp.watch(files, gulp.series(buildTaskName));
});

监视任务有效。我希望这对可能正在尝试构建类似 Gulp 设置的任何其他人有所帮助。

从对象中的条目动态生成 Gulp 4 个任务

Dynamically generate Gulp 4 tasks from entries in an object

javascript

gulp