Merge pull request #4981 from alphagov/fix-vite-code-splitting

Build each entry independently when testing Vite

.github/workflows/bundler-integrations/package.json

@@ -8,13 +8,14 @@
     "rollup:initAll": "npm run rollup:cli -- -o dist/rollup/initAll.js ./src/initAll.mjs",
     "rollup:cli": "rollup -c rollup.config.mjs",
     "webpack": "webpack --mode production -o dist/webpack",
-    "vite": "vite build",
+    "vite": "cross-env ENTRY_NAME=single-component vite build && cross-env ENTRY_NAME=initAll vite build",
     "clean": "del-cli dist",
     "build:all": "concurrently \"npm run rollup\" \"npm run webpack\" \"npm run vite\" --names \"rollup,webpack,vite\" --prefix-colors \"red.dim,blue.dim,yellow.dim\""
   },
   "devDependencies": {
     "@rollup/plugin-node-resolve": "^15.2.3",
     "concurrently": "^8.2.2",
+    "cross-env": "^7.0.3",
     "del-cli": "^5.1.0",
     "govuk-frontend": "*",
     "rollup": "^4.17.2",

.github/workflows/bundler-integrations/vite.config.mjs

@@ -1,15 +1,22 @@
-/** @type {import('vite').UserConfig} */
-// the default vite config used by the different test case configs
+// Allows to run the same configuration against different files
+// as Vite would split shared code in a separate chunk if trying
+// to build an array of entries in `build.rollupOptions.input`
+// or `build.lib.entry`
+const entryName = process.env.ENTRY_NAME ?? 'single-component'
 
+/** @type {import('vite').UserConfig} */
 export default {
   build: {
     // Align output with other bundlers to facilitate testing
     outDir: 'dist/vite',
     assetsDir: '.',
     // Prevent minification so we can see actual class/function names
     minify: false,
+    // Vite will clean the build folder, but we'll have two concurrent builds
+    // (one for each entry) so we want to prevent that
+    emptyOutDir: false,
     rollupOptions: {
-      input: ['./src/single-component.mjs', './src/initAll.mjs'],
+      input: `./src/${entryName}.mjs`,
       output: {
         entryFileNames: '[name].js'
       }