如何为create-react-app创建多个条目和输出并保持它们分开?

时间:2018-03-22 18:48:37

标签: javascript reactjs webpack electron create-react-app

我的用例是我正在使用电子,并希望有多个可以加载的窗口。最初将加载一个节点应用程序,但不会向用户显示。我只是用它来运行特定的任务。另一个窗口将是UI客户端,这将建立在反应中。我正在使用create-react-app。

我采取的步骤

  • 我已经退出了。
  • 我创建了多个入口点。

基本上,我已经按照讨论here

进行了讨论

我目前面临的问题是webpack正在将我的第二个捆绑文件插入orignal sort(null)

我希望两个捆绑包保持完全分离,因为辅助捆绑包将由电子启动。

我需要在我的webpack配置中修改什么才能使捆绑包完全分开?

修改

webpack.config.dev.js

项:

index.html

插件中的其他entry: { app: [ require.resolve('./polyfills'), require.resolve('react-dev-utils/webpackHotDevClient'), paths.appIndexJs, ], secondary: [ require.resolve('./polyfills'), require.resolve('react-dev-utils/webpackHotDevClient'), paths.secondaryIndexJs, ] }, output: { pathinfo: true, filename: 'static/js/[name].bundle.js', chunkFilename: 'static/js/[name].chunk.js', publicPath: publicPath, devtoolModuleFilenameTemplate: info => path.resolve(info.absoluteResourcePath).replace(/\\/g, '/'), },

HtmlWebpackPlugin

paths.js

  • 相应地修改

1 个答案:

答案 0 :(得分:1)

解决方案是简单地将excludeChunks: ["secondary"],添加到原始HtmlWebpackPlugin属性。

总体而言:

 new HtmlWebpackPlugin({
  inject: true,
  template: paths.appHtml,
  excludeChunks: ["secondary"]
}),
new HtmlWebpackPlugin({
  inject: true,
  chunks: ["secondary"],
  template: paths.secondaryHtml,
  filename: 'secondary.html',
}),