Javascript 那么，gulp concat和lazypipe的组合在使用gulp 4时会导致错误吗？

我正在从Gulp 3升级到4，但遇到了一个错误：

The following tasks did not complete: build
Did you forget to signal async completion?

我明白它在说什么，但不明白为什么这个代码会触发它

错误与否，任务完成（文件连接并写入dest）。不使用lazypipe执行相同的代码不会导致错误，删除lazypipe中的连接也会修复错误

将整个过程包装在创建流（如合并流）的东西中，可以解决这个问题。我猜是由于咕噜咕噜和懒人管之间的相互作用，导致了一条流无法正确返回

以下是（简化的）任务：

任何建议，谢谢

这是在将

lazypipe

与gulp 4一起使用时出现的问题，在不久的将来不会修复。引述该期：

过度热情于2015年12月20日发表评论
到目前为止，我无意让懒人管在Gulp4上工作

据我所知，这个问题是由gulp 4使用的事实造成的，这说明了它的流支持：

注意：只支持实际流，不支持伪流；因此，不支持

事件流

等模块

当您使用

lazypipe（）

作为最后一个管道时，您得到的是一个流，它没有使用gulp中的流时通常具有的许多属性。通过记录流，您可以自己看到这一点：

// console output shows lots of properties
console.log(gulp.src(src('js/**/*.js'))
  .pipe(plugins.concat('cat.js'))
  .pipe(gulp.dest(dest))); 

// console output shows much fewer properties
console.log(gulp.src(src('js/**/*.js'))
  .pipe(buildFiles())); 

这可能就是为什么gulp认为第二条流是“人造流”，并且无法正确检测流何时结束的原因

在这一点上，您唯一的选择是某种解决方法。最简单的解决方法（不需要任何额外的软件包）是向任务中添加回调函数

cb

，并侦听

'end'

事件：

gulp.task('build', function(cb) {
  var dest = 'build';

  var buildFiles = lazypipe()
   .pipe(plugins.concat, 'cat.js') 
   .pipe(gulp.dest, dest);

  gulp.src(src('js/**/*.js'))
   .pipe(buildFiles())
   .on('end', cb);
});

或者，在

buildFiles（）

之后添加任何

.pipe（）

都可以解决此问题，即使是实际上不执行以下操作的：

---

因此，错误是显而易见的。我必须进行一些重构，使Gulp4的工作恢复正常。我最终制作了一些额外的方法，这些方法采用源和目标，并执行以前由lazypipe实现完成的任务

我得说我现在不想念懒鬼。这只是一种不同的方法。我确实完成了一些额外的任务，但他们使用了标准方法，如下面的示例所示：

// previously a lazypipe, now just a method to return from a gulp4 task 
const _processJS = (sources, destination) => {

  return src(sources)
    .pipe(minify(...))
    .pipe(uglify(...))
    .pipe(obfuscate(...))
    .pipe(whatever())
    .pipe(dest(destination));

};

const jsTaskXStep1 = ()=>{
  return src(...).pipe(...).pipe(...).pipe(dest(...));
};

const jsTaskXStep2 = ()=>{
  return _processJS(['./src/js/x/**/*.js'], './dist/js');
};

const jsTaskYStep1 = ()=>{
  return src(...).pipe(...).pipe(...).pipe(dest(...));
};

const jsTaskYStep2 = ()=>{
  return _processJS(['./src/js/y/**/*.js'], './dist/js');
};

const jsTaskX = series(jsTaskXStep1, jsTaskXStep2);
const jsTaskY = series(jsTaskYStep1, jsTaskYStep2);

module.exports = {
  js: parallel(jsTaskX, jsTaskY),
  css: ...,
  widgets: ...,
  ...
  default: parallel(js, css, widgets, series(...), ...); 
}

---

所以基本上你可以把你的懒散的东西放在像本例中的_processJS这样的方法中。然后创建使用它的任务，并将所有内容与gulp串联和并联结合起来。希望这能帮助你们中的一些人解决这个问题。

感谢您的清晰详细的解释，非常感谢！

var gutil = require('gulp-util');

gulp.task('build', function() {
  var dest = 'build';

  var buildFiles = lazypipe()
    .pipe(plugins.concat, 'cat.js') 
    .pipe(gulp.dest, dest);

  return gulp.src(src('js/**/*.js'))
    .pipe(buildFiles())
    .pipe(gutil.noop());
});

// previously a lazypipe, now just a method to return from a gulp4 task 
const _processJS = (sources, destination) => {

  return src(sources)
    .pipe(minify(...))
    .pipe(uglify(...))
    .pipe(obfuscate(...))
    .pipe(whatever())
    .pipe(dest(destination));

};

const jsTaskXStep1 = ()=>{
  return src(...).pipe(...).pipe(...).pipe(dest(...));
};

const jsTaskXStep2 = ()=>{
  return _processJS(['./src/js/x/**/*.js'], './dist/js');
};

const jsTaskYStep1 = ()=>{
  return src(...).pipe(...).pipe(...).pipe(dest(...));
};

const jsTaskYStep2 = ()=>{
  return _processJS(['./src/js/y/**/*.js'], './dist/js');
};

const jsTaskX = series(jsTaskXStep1, jsTaskXStep2);
const jsTaskY = series(jsTaskYStep1, jsTaskYStep2);

module.exports = {
  js: parallel(jsTaskX, jsTaskY),
  css: ...,
  widgets: ...,
  ...
  default: parallel(js, css, widgets, series(...), ...); 
}