Question

我正在使用Gulp收集前端内容（通过gulp-front-matter插件），然后在聚合之后，我将其保存到另一个文件中。在其他数据中，我正在保存一堆CSS。这是我对compileCSS任务的所有内容：

var collected = [];

gulp.src('./client/**/*.html')
  .pipe(frontMatter({ property: 'meta', remove: true }))
  .pipe(through.obj(function(file, enc, callback) {
       var css = file.meta;
       collected.push(css);
   }))
   .pipe(gulp.dest('./build/templates'))
   .on('end', function() {
       var cssPath = ['build', 'assets', 'css', 'compiled.css'];
       fs.writeFileSync(cssPath.join(path.sep), cssPath);
   })

任务按预期工作（注意，它是简化版）。一切都按预期工作，我得到一个包含所有前端CSS的compiled.css文件。但是，我发现不仅需要在我的常规css文件中使用Prefixer，还需要在这个新的compiled.css上使用Prefixer。所以我创建了一个prefix任务：

gulp.task('prefix', ['compileCSS', 'copy'], function() {
    gulp.src('./build/assets/css/*.css')
        .pipe(autoprefixer({ browsers: ['last 3 versions'] }))
        .pipe(gulp.dest('build'))
    ;
});

现在，问题是on('end'函数在所有任务结束时运行，而不仅仅是compileCSS任务。

我的问题是，有没有办法为每项任务注入“on end”类型的任务？或者有没有办法以某种方式使用流（因为最后一个任务不是一个实际的流，并没有利用它，我不知道如何）。

Answer 1

这不是问题的顺序，我没有返回创建竞争条件的流，所以这样的修复工作：

return gulp.src('./client/**/*.html')
          .pipe(dosomething());
  \\ all other code

我想问题是Gulp在启动下一个事件之前等待完成一个流。如果没有返回流或承诺，Gulp只会完成任务并且不会等待它完成。

Answer 2

您可以尝试run-sequence：

var runSequence = require('run-sequence');
gulp.task('mytask', function(cb) {
  runSequence(
    ['parallel1', 'parallel2'],
    'seq1',
    'seq2',
    cb
  );
});

如果您想要与gulpfile更相关的内容，则应将其包含在您的问题中。

你如何运行gulp“on end”任务但仅在当前任务结束时？

2 个答案: