Question

我设置了两个任务。 webpack任务和注入任务。

的WebPack：

gulp.task('webpack', (done) => {
  gulp.src('./src/app/app.module.js')
    .pipe(plugins.webpack({
      module: {
        loaders: [
          { test: /\.html$/, loaders: ["html"]},
          { test: /\.js$/, exclude: /(node_modules|bower_components)/, loaders: ['babel-loader']}
        ]
      }
    }))
    .pipe(gulp.dest('.tmp/scripts/'))
    done();
})

注入：

gulp.task('inject', ['webpack'], () => {
  var globalSources = gulp.src(['.tmp/scripts/*.js'], {read: false});
  return gulp.src('src/index.html')
    .pipe(plugins.plumber())
    .pipe(plugins.inject(globalSources, {
      addRootSlash: false,
      addPrefix: '.',
      ignorePath: '.tmp'
    }))
    .pipe(gulp.dest('.tmp/'));
})

我发现webpack任务会在将流式文件放入.tmp / scripts文件夹之前说完了。因此，当注入进行时，没有文件要注入。

webpack-stream输出它在done（）之前使用的回调？

Answer 1

您在启动流后立即调用done()，它可能看起来有所不同，因为您在流的末尾留下了分号并且缩进了done()。你真正拥有的是：

gulp.task('webpack', (done) => {
  gulp.src('./src/app/app.module.js')
    .pipe(plugins.webpack(/* config */))
    .pipe(gulp.dest('.tmp/scripts/'));
  done();
})

您要做的是在流中调用（在管道的末尾）。根据{{3}}的文档，您可以使用.on('end', callback)来实现这一目标。所以完整的任务看起来像这样：

gulp.task('webpack', (done) => {
  gulp.src('./src/app/app.module.js')
    .pipe(plugins.webpack({
      module: {
        loaders: [
          { test: /\.html$/, loaders: ["html"]},
          { test: /\.js$/, exclude: /(node_modules|bower_components)/, loaders: ['babel-loader']}
        ]
      }
    }))
    .pipe(gulp.dest('.tmp/scripts/'))
    .on('end', done)
})

如何使用gpack注入webpack-stream？

1 个答案: