Extracting shared resources out to a bootstrap file

Author: rorticus

src/base.config.ts

@@ -175,6 +175,24 @@ export default function webpackConfigFactory(args: any): webpack.Configuration {
 			];
 			return entry;
 		}, {}),
+		optimization: {
+			splitChunks: {
+				cacheGroups: {
+					default: false,
+					vendors: false,
+
+					common: {
+						name: 'bootstrap',
+						minChunks: 2,
+						chunks: 'all',
+						priority: 10,
+						reuseExistingChunk: true,
+						enforce: true,
+						test: ({ resource }) => /node_modules/.test(resource)
+					}
+				}
+			}
+		},
 		node: { dgram: 'empty', net: 'empty', tls: 'empty', fs: 'empty' },
 		output: {
 			chunkFilename: isLib ? '[name].js' : `[name]-${packageJson.version}.js`,

test-app/src/evergreen.html

@@ -4,6 +4,7 @@
 	<title>custom-element</title>
 	<meta name="viewport" content="width=device-width, initial-scale=1">
 	<script src="../../node_modules/@webcomponents/custom-elements/custom-elements.min.js"></script>
+	<script src="./bootstrap-1.0.0.js"></script>
 	<script src="./menu-1.0.0.js"></script>
 	<script src="./menu-item-1.0.0.js"></script>
 	<link rel="stylesheet" href="./menu-1.0.0.css" />

test-app/src/legacy.html

@@ -5,6 +5,7 @@
 	<meta name="viewport" content="width=device-width, initial-scale=1">
 	<script src="../../node_modules/@webcomponents/custom-elements/custom-elements.min.js"></script>
 	<script src="../../node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+	<script src="./bootstrap-1.0.0.js"></script>
 	<script src="./menu-1.0.0.js"></script>
 	<script src="./menu-item-1.0.0.js"></script>
 	<link rel="stylesheet" href="./menu-1.0.0.css" />