如何在 gulp 中创建重复管道?

Posted

技术标签:

【中文标题】如何在 gulp 中创建重复管道?【英文标题】:How to create repeating pipe in gulp? 【发布时间】:2015-03-29 13:25:36 【问题描述】:

我有一个 gulp 任务在 index.html 中注入几个依赖项:

return gulp.src(config.serve.html)
          .pipe($.inject(gulp.src(prependSource(config.inject.source.indexes)), 
            read: false,
            starttag: config.inject.indexes,
            addRootSlash: false,
            addPrefix: prefix,
            ignorePath: ignore
          ))
          .pipe($.inject(gulp.src(managerList), 
            read: false,
            starttag: config.inject.managers,
            addRootSlash: false,
            addPrefix: prefix,
            ignorePath: ignore
          ))
          .pipe($.inject(gulp.src(prependSource(config.inject.source.directives)), 
            read: false,
            starttag: config.inject.directives,
            addRootSlash: false,
            addPrefix: prefix,
            ignorePath: ignore
          ))

          .pipe($.inject(gulp.src(prependSource(config.inject.source.routes)), 
            read: false,
            starttag: config.inject.routes,
            addRootSlash: false,
            addPrefix: prefix,
            ignorePath: ignore
          ))
          .pipe($.inject(gulp.src(prependSource(config.inject.source.css)), 
            read: false,
            starttag: config.inject.css,
            addRootSlash: false,
            addPrefix: prefix,
            ignorePath: ignore
          ))


          .pipe($.size())
          .pipe(gulp.dest(dest));
;

如您所见,所有管道都以某种方式重复(managerList 除外)。所以我想要的是在一系列注入的帮助下将重复管道合并到一个管道中。如何达到同样的效果?

【问题讨论】:

【参考方案1】:

gulp.src 返回一个流(每个 .pipe 也是如此)。如果您考虑每个 .pipe 调用在做什么,您可以简单地将其转换为 for 循环。像这样的:

config =  /* your config object */ ;

var stream = gulp.src(/* source glob */);
for (var i = 0; i < injects.length; i++) 
  stream = stream.pipe($.inject(gulp.src(prependSource(config.inject.source[i])), config.inject.starttag[i]));


stream.pipe($.size())
      .pipe(gulp.dest(dest));

return stream;

【讨论】:

谢谢!这正是我想要的。 非常感谢您的回答。我已经有一个循环,但没有重新分配流变量。这导致了以下警告(node:1798) Warning: Possible EventEmitter memory leak detected. 11 end listeners added. Use emitter.setMaxListeners() to increase limit。将stream.pipe 的结果分配回stream 解决了这个问题!

以上是关于如何在 gulp 中创建重复管道?的主要内容,如果未能解决你的问题,请参考以下文章