Webpack v4 with multiple entries on a single page, chunks are duplicated unnecessarily

I have a multipage website with a subset of pages that is a SPA. We just upgraded to Webpack V4 and have encountered some new issues that we havent seen before.

Our pages always include a script tag for app.build.js. This file has global inits, and imports our public path. It imports things like Modernizr and builds our site navigation.

Additionally, on a per-page basis we serve a second JS file like account.build.js. Some pages do not have this second file if they are very simple. They still need app.build.js to create the navigation though.

It appears as though Webpack doesn't know about this combination, so there are redundant chunks in the two output files. they both may include a Modernizr test, etc. and all of that gets added to both build files bloating them significantly.

My question is, how do you tell Webpack that app.build.js is globally included??? We do this with SplitChunks for our vendors, but it matches on imports, not on the entry file name.

We also now need to import './public-path'; in every entry file, which isn't ideal. I would prefer to do it once in app.build.js and have it globally recognized.

Bug filed with Webpack here: https://github.com/webpack/webpack/issues/8842

from Webpack v4 with multiple entries on a single page, chunks are duplicated unnecessarily