gulp.paralell() 或 gulp.series() 中的条件 gulp 任务

关于管道内条件任务的信息太多(例如"gulp-if"插件(。但是，实际上它不是"条件任务"：它是"条件插件用法"，一个任务可以使用多个插件。这是如何有条件地运行任务 NOT 在管道内(例如，在gulp.paralell()内(

假设任务名称可以包含空格，以提供易于理解的任务含义。

gulp.task('Build', gulp.paralell(
'Preprocess HTML',
'Prepeocess styles',
done => {
if(checkSomeCondition()){
runTask('some Task') // but how?
}
else {
done();
}
}
))

gulp4.0 的美妙之处在于你的任务可以只是函数，所以以下工作：

gulp.task('Preprocess HTML', function () {
console.log("in Preprocess HTML");
return gulp.src('./');
});

您可以使用上述版本("旧方式"(或更新的版本在下面。
我在这里展示了两个使用两个版本的任务，但我个人不会混合它们。

// function PreprocessHTML() {
//   console.log("in Preprocess HTML");
//   return gulp.src('./');
// }
function PreprocessStyles() {
console.log("in Preprocess styles");
return gulp.src('./');
}
function testTaskTrue() {
console.log("in testTaskTrue");
return gulp.src('./');
}
function testTaskFalse() {
console.log("in testTaskFalse");
return gulp.src('./');
}
function checkSomeCondition() {
console.log("in checkSomeCondition");
return false;
}
//    Again, I definitely wouldn't mix the two versions of tasks as shown below.
//    Just here for demonstration purposes.
gulp.task('test', gulp.parallel( 'Preprocess HTML',  PreprocessStyles,
done => {
if (checkSomeCondition()) {
// so testTaskTrue can be any gulp4.0 task, easy to call since it just a function
testTaskTrue();
}
else {
testTaskFalse();
}
done();
}
));

对于 gulp 4，首先创建此帮助程序函数：

function gulpTaskIf(condition, task) {
task = gulp.series(task) // make sure we have a function that takes callback as first argument
return function (cb) {
if (condition()) {
task(cb)
} else {
cb()
}
}
}

作为其第一个参数，此帮助程序采用函数形式的条件。条件函数在任务执行开始时运行，因此您可以在条件函数中检查先前步骤的输出。
第二个参数指定要运行的任务，可以是gulp.parallel()或gulp.series()接受的相同值作为参数，即字符串、函数引用或来自另一个gulp.parallel()或gulp.series()的返回值。
返回一个函数，该函数可以作为第二个参数传递给gulp.task()，也可以作为参数传递给gulp.parallel()或gulp.series()调用。

示例(第一个匹配问题(：

嵌入在例如 gulp.parallel(( 或 gulp.series(( 中，按名称调用任务

gulp.task('Build', gulp.parallel(
'Preprocess HTML',
'Prepeocess styles',
runTaskIf(checkSomeCondition, 'some Task')
))

作为任务，按名称调用任务

function myTask() {
return gulp.src(...)
...
.dest(...)
}
gulp.task('my-task', myTask)
gulp.task('default', gulpTaskIf(
function () {
return Math.random() < 0.5; // example condition
},
'my-task')

作为独立任务，按函数引用调用任务

function myTask() {
return gulp.src(...)
...
.dest(...)
}
gulp.task('default', gulpTaskIf(() => Math.random() < 0.5, myTask)

作为独立任务，调用 gulp.parallel(( 或 gulp.series(( 引用

const manyTasks = gulp.parallel(task1, task2, task3)
gulp.task('default', gulpTaskIf(
function () {
return Math.random() < 0.5;
},
manyTasks)

现在怎么样了(Gulp 4的解决方案(

gulp.series(
task1,
...(condition ? [task2] : [])
);

这真的很简单。无需辅助功能：

gulp.task('Build', function() {
const tasks = ['Preprocess HTML', 'Preprocess styles'];
if(checkSomeCondition()) tasks.push('some Task');
return gulp.parallel(tasks);
}());

线索是在最后一行调用函数 - 它将返回一个调整后的 gulp.parallel 任务 - 我正在使用它来处理命令行参数 (yargs(

警告：这将在第一个任务执行之前执行，并且也将在运行"构建"以外的其他任务时执行。在实现逻辑;)时，只需牢记这一点

我有一个插件数组，我在其中执行简单的 If 查询，然后展开数组，请参阅此处的第 280 行。

基于Gulp 4。

对于构建过程，我将 Const 更改为 Let，并使用 If 对其进行查询。

相关内容

最新更新

热门标签：