Question

我正在尝试设置Gulp任务，以使用.ttf和gulp-ttf2woff插件将gulp-ttf2woff2字体转换为webfont格式。分别将源字体转换为.woff和.woff2。

我提供了这两个单独的功能，每个插件一个：

function fontsW(done) {
    src(fontsSrc)
        .pipe(ttf2woff())
        .pipe(dest(fontsDist))
    done();
};

function fontsW2(done) {
    src(fontsSrc)
        .pipe(ttf2woff2())
        .pipe(dest(fontsDist))
    done();
};

是否可以将它们压缩为一个函数，我们将其称为function fonts(done) {}，它可以同时处理两个插件？

基本上，我想要这样的东西

function fontsW2(done) {
    src(fontsSrc)
        .pipe(ttf2woff())
        .pipe(ttf2woff2())
        .pipe(dest(fontsDist))
    done();
};

ttf2woff()和ttf2woff2()都收到src的输出，并将自己处理的文件提供给dest。

Answer 1

您可以这样做：

function fontsW(done) {
    src(fontsSrc)
        .pipe(ttf2woff())
        .pipe(dest(fontsDist))

     src(fontsSrc)
        .pipe(ttf2woff2())
        .pipe(dest(fontsDist))
    done();
};

Answer 2

您可以定义一个并行调用两个函数的任务：

gulp.task('fonts', gulp.parallel(ttf2woff, ttf2woff2));

您可以在其他任务中使用此任务（例如，从default任务中调用它），也可以直接从终端中调用它：

gulp fonts

如何在Gulp管道中并行运行两个单独的插件？

2 个答案: