你能一次运行多个webpack实例吗？

Question

假设我有一个组件数组，需要吐出自己的源代码，因为它们不会总是包含在一起，它需要是它自己的包。我们的想法是，最终会有100个组件，并且可以随时挑选它们。

然而，当使用gulp使用webpack-stream时，即使我正在动态注册任务，并且我可以看到它们按顺序运行，它只能按照它的外观运行一个webpack流，但似乎将它的捆绑从SECOND组件输出到第一个组件目录。

这是一个非常简单的构建过程，它是一组像这样的组件：

var components = [
    {'name : 'a', src : './foo/bar/entrya.js', dest : '/dir/a'},
    {'name : 'b', src : './foo/bar/entryb.js', dest : '/dir/b'},
];

比较简单吧？然后注册任务，就像这样：

components.forEach(component => {
    gulp.task(component.name, cb => {

        function task(component) {
            return gulp.src(component.src)
            .pipe($.webpackStream(webpackConfig))
            .pipe(component.dest(component.dest));
        }

        return task.apply(this, [component, cb]);
    });
});

这是我所拥有的令人难以置信的愚蠢版本，但它几乎是一样的，动态生成，然后我们顺序运行这些任务。

Answer 1

webpack-stream可以处理多个入口点和每个多个入口点的多个构建。

var gulp = require('gulp');
var webpack = require('webpack-stream');
gulp.task('build', function() {
  return gulp.src(['src/entry.js']) // entry.js file doesn't need to exist 
    .pipe(webpack({
      entry:  {
        a : __dirname + "/foo/bar/entrya.js",
        b : __dirname + "/foo/bar/entryb.js"
      },
      output: {
        filename: '[name].js'
      }
    }))
    .pipe(gulp.dest('dir/'));
});

Answer 2

您的构建未并行运行。你只是顺序注册任务。但是，您可以将这些任务作为子进程并行运行。您可以使用的一个好选择是parallel-webpack。