4

私は異なる反応アプリケーションを持つ異なるgitを持っています。すべてのアプリケーションが外部パッケージ (React、ReactDOM ...) で同じベンダーのチャンク ファイルを使用する必要がある場合

プロジェクトのセットアップ:

Project 1 (git)
   /dist/...
   /src/...
   webpack.config.js
Project 2 (git)
   /dist/...
   /src/...
   webpack.config.js
Project N (git)
   ...

すべてwebpack.config.jsにこの構成が含まれていますが、ライブラリ名が異なります。

module.exports = {
  entry: {
      app: './src/App.ts',
      vendor: ['react', 'react-dom', 'react-redux', 'redux', 'redux-thunk']
  },
  output: {
      path: path.resolve(__dirname, "dist"),
      filename: '<Name>.bundle.js',
      library: "<Name>",
      libraryTarget: "umd"
  },
  module: { /* ... */ },
  plugins: [
      new webpack.optimize.CommonsChunkPlugin({
          name: 'vendor',
          filename: 'vendor.bundle.js'
      })
  ]
}

問題:

Webpack は、vendor.bundle.jsグローバルな使用ではなく、現在のライブラリ/プロジェクト用に特別にビルドvendor.bundle.jsします。このファイルに基づいて両方のアプリケーションをロードできる単一のページに含めることができるWebpack を作成するオプションはありますか?

例:

<html>
   <head>
      <script src="/vendor.bundle.js"></script>
   </head>
   <body>
      <script src="/app1.bundle.js"></script>
      <script src="/app2.bundle.js"></script>
   </body>
</html>
4

1 に答える 1