Fix scripts not loading from the production ready build PR (#183)

Follow-up to https://github.com/matrix-org/matrix-public-archive/pull/175

build-scripts/vite.config.js

@@ -20,11 +20,14 @@ module.exports = defineConfig({
     // splitVendorChunkPlugin(),
   ],
 
-  //root: './',
-  //base: './',
-  // optimizeDeps: {
-  //   include: ['matrix-public-archive-shared'],
-  // },
+  optimizeDeps: {
+    include: [
+      // This doesn't seem to be necessary for the this package to work (ref
+      // https://vitejs.dev/guide/dep-pre-bundling.html#monorepos-and-linked-dependencies)
+      //
+      //'matrix-public-archive-shared'
+    ],
+  },
   resolve: {
     alias: {
       // The `file:` packages don't seem resolve correctly so let's add an alias as well
@@ -72,9 +75,17 @@ module.exports = defineConfig({
     // Copy things like the version files from `public/` to `dist/`
     copyPublicDir: true,
 
-    // Fix `Error: 'default' is not exported by ...` when importing CommonJS files, see
-    // https://github.com/vitejs/vite/issues/2679 and docs:
-    // https://vitejs.dev/guide/dep-pre-bundling.html#monorepos-and-linked-dependencies
-    commonjsOptions: { include: [/shared/] },
+    commonjsOptions: {
+      include: [
+        // Fix `Error: 'default' is not exported by ...` when importing CommonJS files, see
+        // https://github.com/vitejs/vite/issues/2679 and docs:
+        // https://vitejs.dev/guide/dep-pre-bundling.html#monorepos-and-linked-dependencies
+        /shared\//,
+
+        // Make all of our `require()` CommonJS calls compatible in the ESM client build.
+        // See https://vitejs.dev/guide/dep-pre-bundling.html#monorepos-and-linked-dependencies
+        /node_modules/,
+      ],
+    },
   },
 });

server/hydrogen-render/render-page-html.js

@@ -88,7 +88,7 @@ if (atEventId) {
           ${scripts
             .map(
               (scriptUrl) =>
-                `<script type="text/javascript" src="${scriptUrl}" nonce="${pageOptions.cspNonce}"></script>`
+                `<script type="module" src="${scriptUrl}" nonce="${pageOptions.cspNonce}"></script>`
             )
             .join('\n')}
           <script type="text/javascript" nonce="${pageOptions.cspNonce}">

server/lib/get-dependencies-for-entry-point-name.js

@@ -10,6 +10,7 @@ function getManifest() {
   if (_manifest) {
     return _manifest;
   }
+
   // We have to disable this because it's built via the Vite client build.
   // eslint-disable-next-line n/no-missing-require, n/no-unpublished-require
   _manifest = require('../../dist/manifest.json');
@@ -33,16 +34,19 @@ function recurseManifestEntryName(entryName) {
   const manifest = getManifest();
   const entry = manifest[entryName];
 
+  const entryFilePath = path.join('/', entry.file);
+
   // css
   const styles = [];
   // imports
-  const scripts = [];
+  const scripts = [entryFilePath];
   // imports, dynamicImports
-  const preloadScripts = [];
+  const preloadScripts = [entryFilePath];
 
   for (const importName of entry.imports || []) {
-    scripts.push(path.join('/', importName));
-    preloadScripts.push(path.join('/', importName));
+    const importFilePath = path.join('/', manifest[importName].file);
+    scripts.push(importFilePath);
+    preloadScripts.push(importFilePath);
 
     const {
       styles: moreStyles,
@@ -56,7 +60,8 @@ function recurseManifestEntryName(entryName) {
   }
 
   for (const dynamicImportName of entry.dynamicImports || []) {
-    preloadScripts.push(path.join('/', dynamicImportName));
+    const dynamicImportFilePath = path.join('/', manifest[dynamicImportName].file);
+    preloadScripts.push(dynamicImportFilePath);
 
     const {
       styles: moreStyles,