Webpack 4 splitChunks and libraryTarget

Question

I have some entries: app, vendor, polyfills, bootstrap and output as library ['app', '[name]'] and libraryTarget var.

In the browser app variable contains:

{bootstrap: Module, polyfills: Module, vendor: Module, app: Module}

If I use optimization.splitChunks to move rxjs to bootstrap chunk app variable contains:

{polyfills: Module, vendor: Module, app: Module}

(without bootstrap chunk)

My config:

optimization: {
  runtimeChunk: {
    name: 'bootstrap'
  },
  splitChunks: {
    minSize: 1,
    chunks: 'all',
    cacheGroups: {
        vendors: false,
        default: false,
        rxjs: {
          name: 'bootstrap',
          test: /[\\/]node_modules[\\/]rxjs[\\/]/
        }
    }
  }
}

How to move rxjs to bootstrap chunk not lose app.bootstrap variable value?

Answer 1

1. vendor, polyfills, bootstrap can't be entrypoints. only app is real entry point.

2. you should not manage chunks with webpack "manually", let say you have real entry points app1 and app2 (because you app consists from two pages); then webpack will generate those files for you:

vendor.js vendor~app1.bundle.js app1.js - should be loaded on first page

vendor.js vendor~app2.bundle.js app2.js - should be loaded on second page