如何从另一个gulp任务中运行一个gulp任务？

Question

如何从另一个gulp任务中运行一个gulp任务？

63

我知道可以声明依赖项，在任务运行之前运行，例如：

gulp.task('a', () => {});
gulp.task('b', () => {});
gulp.task('c', ['a', 'c'], () => {});

每次调用任务'c'并在其执行之前，都将运行任务'a'和'b'。

但是，在gulp.task内部如何以编程方式调用任意任务呢？

- Gajus

7个回答

26

我发现从Gulp 4+开始，以下内容可以很好地替代gulp.start:

const task1 = () => { /*do stuff*/ };
const task2 = () => { /*do stuff*/ };

// Register the tasks with gulp. They will be named the same as their function
gulp.task(task1);
gulp.task(task2);

...

// Elsewhere in your gulfile you can run these tasks immediately by calling them like this
(gulp.series("task1", "task2")());
// OR
(gulp.parallel("task1", "task2")());

- DoubleA

7

在其他答案中提到了“不要”的普遍主题，但这取决于你正在做什么。

如果你在考虑：

gulp.task("a", () => {
    doSomethingInstant()
    return doTaskB()
})

您希望：

gulp.task("meta-a", () => {
    doSomethingInstant()
})
gulp.task("a", ["meta-a", "b"])

这样可以生效，因为所有任务都按顺序开始，所以如果“元-a”中没有异步操作，它将在“b”启动之前完成。如果是异步的，则需要更加明确：

gulp.task("meta-a", () => {
    return doSomethingAsync()
})
function taskB() {
    // Original task B code...
}
gulp.task("b", taskB)
gulp.task("a", ["meta-a"], taskB)

- Jim Driscoll

7

相关的内容是，你可以在gulp v4中使用gulp.series或gulp.parallel来启动任务。虽然它不是gulp.start的直接替代品，但它实现了相同的目标。

例如：

在v4之前：

gulp.task('protractor', ['protractor:src']);

在v4之后

gulp.task('protractor', gulp.series('protractor:src'));

- John Lee

3

正如JeffryHouser所述，使用以下方法可以工作，但已被弃用并将在未来版本中删除。我刚刚在3.9.1上尝试了以下操作，它可以正常工作。

代码：

// Variables
var gulp = require('gulp');
var less = require('gulp-less');
var watch = require('gulp-watch');


// Task to compile less -> css: Method 1- The bad way
gulp.task('default', function(){
    gulp.src('src/*.less')
    gulp.start('lessToCss');
});

gulp.task('lessToCss', function() {
    gulp.src('src/*.less')
    .pipe(less())
    .pipe(gulp.dest('src/main.css'));
});

评论中提到的第二种方法是：

“将任务拆分为函数，如果需要，可以在其他任务中重用它们”来自前面提到的问题的建议

我使用lazypipe()实现这个功能 https://www.npmjs.com/package/lazypipe

代码：

// Variables
var gulp = require('gulp');
var less = require('gulp-less');
var watch = require('gulp-watch');

var lazypipe = require('lazypipe');
var fixMyCSS = lazypipe()
     .pipe(less); // Be CAREFUL here do not use less() it will give you an errror



// Task to compile less -> css: Method 2 - The nice way
gulp.task('default', function(){
    //gulp.start('lessToCss');
    gulp.src('src/*.less')
    .pipe(fixMyCSS())
    .pipe(gulp.dest('src/main.css'));
});

简单比较

方法1产生以下结果:

开始'default'...
[22:59:12] 开始'lessToCss'...
[22:59:12] 在13毫秒后完成'lessToCss'
[22:59:12] 在48毫秒后完成'default'

总计用时61毫秒

方法2呢？ - [23:03:24] 开始'default'... - [23:03:24] 在38毫秒后完成'default'

实际上只有38毫秒

总差别为23毫秒

那么这是为什么呢？我对gulp不够了解，但可以说方法2显然是更易读、易于维护甚至速度更快的选择。

只要你理解不直接在中调用流就很容易编写它们。

- Callat

1

这是对@Novellizator评论的比我的解释更复杂的解释。我修改了我的答案，包括另一种方法。在孤立地评估性能统计数据很困难，特别是因为你正在运行不同的代码。如果lessToCss使用增量方法，第二次运行应该比第一次快。 - JeffryHouser

1

.start已经被弃用。 - Jonathan

-2

对我来说，最好的方式是：

task('task1', () => {
  // Buy potatoes
});

task('task2', ['task1'], () => {
  // Cut potatoes
});

任务2 的结果将是：买土豆和切土豆

- Sebastian Diez

-6

有几种方法可以做到这一点：第一种：只需调用另一个任务的新调用：

gulp.task('foo', function() {
  gulp.task('caller', ['bar']); // <- this calls the other existing task!
}
gulp.task('bar', function() {
  //do something
}

第二种方法不太干净：Gulp是JavaScript，所以您只需将一些指令设置为随机函数并调用它即可！

gulp.task('task', function() {
  recurrent_task();
}
gulp.task('task2', function() {
  recurrent_task();
}
function recurrent_task() {
  //do something
}

- PpToño

1

第一个建议只是注册了一个 gulp 任务，但没有回调函数，所以它不起作用。 - joeycozza

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- JeffryHouser · Accepted Answer

我使用 gulp.start() 完成了它，就像这样：

gulp.task('test1', function(){
  gulp.start('test2');
})

gulp.task('test2', function(){
  // do something
})

如果这很重要，我使用的是gulp 3.9.1。看起来gulp.start()可能会被移除或废弃，但目前还没有发生。

更新如果我按照Novellizator的建议将事情分解为单独的函数，那么代码将如下所示：

function doSomething(){
  // do something
}

gulp.task('test1', function(){
  doSomething();
})

gulp.task('test2', function(){
  doSomething();
})

它非常简单，避免使用gulp.start()。