refactor: adjust build input

src/build/build.ts

@@ -24,9 +24,9 @@ export async function build(buildOptions: BuildOptions = {}) {
     )
     console.log('rendering pages...')
 
-    const indexChunk = clientResult.assets.find(
+    const appChunk = clientResult.assets.find(
       (chunk) =>
-        chunk.type === 'chunk' && chunk.fileName.match(/^index\.\w+\.js$/)
+        chunk.type === 'chunk' && chunk.fileName.match(/^app\.\w+\.js$/)
     ) as OutputChunk
 
     // We embed the hash map string into each page directly so that it doesn't
@@ -40,7 +40,7 @@ export async function build(buildOptions: BuildOptions = {}) {
         siteConfig,
         page,
         clientResult,
-        indexChunk,
+        appChunk,
         pageToHashMap,
         hashMapStirng
       )

src/build/bundle.ts

@@ -13,6 +13,7 @@ import {
   BuildResult
 } from 'vite'
 
+const hashRE = /\.(\w+)\.js$/
 const staticInjectMarkerRE = /\b(const _hoisted_\d+ = \/\*#__PURE__\*\/createStaticVNode)\("(.*)", (\d+)\)/g
 const staticStripRE = /__VP_STATIC_START__.*?__VP_STATIC_END__/g
 const staticRestoreRE = /__VP_STATIC_(START|END)__/g
@@ -81,18 +82,10 @@ export async function bundle(
       // for each .md entry chunk, adjust its name to its correct path.
       for (const name in bundle) {
         const chunk = bundle[name]
-        if (isPageChunk(chunk)) {
-          // foo/bar.md -> foo_bar.md.js
-          const hash = isClientBuild
-            ? chunk.fileName.match(/\.(\w+)\.js$/)![1]
-            : ``
-          const pageName = slash(
-            path.relative(root, chunk.facadeModuleId)
-          ).replace(/\//g, '_')
-          chunk.fileName = `${pageName}${hash ? `.${hash}` : ``}.js`
-
-          if (isClientBuild) {
+        if (isPageChunk(chunk) && isClientBuild) {
           // record page -> hash relations
+          const hash = chunk.fileName.match(hashRE)![1]
+          const pageName = chunk.fileName.replace(hashRE, '')
           pageToHashMap[pageName] = hash
 
           // inject another chunk with the content stripped
@@ -107,11 +100,19 @@ export async function bundle(
       }
     }
   }
-  }
 
-  const appEntry = path.resolve(APP_PATH, 'index.js')
-  // convert page files to absolute paths
-  const pages = config.pages.map((file) => path.resolve(root, file))
+  // define custom rollup input
+  // this is a multi-entry build - every page is considered an entry chunk
+  // the loading is done via filename conversion rules so that the
+  // metadata doesn't need to be included in the main chunk.
+  const input: Record<string, string> = {
+    app: path.resolve(APP_PATH, 'index.js')
+  }
+  config.pages.forEach((file) => {
+    // page filename conversion
+    // foo/bar.md -> foo_bar.md
+    input[slash(file).replace(/\//g, '_')] = path.resolve(root, file)
+  })
 
   // resolve options to pass to vite
   const { rollupInputOptions = {}, rollupOutputOptions = {} } = options
@@ -127,11 +128,7 @@ export async function bundle(
     },
     rollupInputOptions: {
       ...rollupInputOptions,
-      // use our custom input
-      // this is a multi-entry build - every page is considered an entry chunk
-      // the loading is done via filename conversion rules so that the
-      // metadata doesn't need to be included in the main chunk.
-      input: [appEntry, ...pages],
+      input,
       // important so that each page chunk and the index export things for each
       // other
       preserveEntrySignatures: 'allow-extension',

src/build/render.ts

@@ -12,15 +12,11 @@ export async function renderPage(
   config: SiteConfig,
   page: string, // foo.md
   result: BuildResult,
-  indexChunk: OutputChunk,
+  appChunk: OutputChunk,
   pageToHashMap: Record<string, string>,
   hashMapStirng: string
 ) {
-  const { createApp } = require(path.join(
-    config.tempDir,
-    ASSETS_DIR,
-    'index.js'
-  ))
+  const { createApp } = require(path.join(config.tempDir, ASSETS_DIR, 'app.js'))
   const { app, router } = createApp()
   const routePath = `/${page.replace(/\.md$/, '')}`
   router.go(routePath)
@@ -47,9 +43,9 @@ export async function renderPage(
     // resolve imports for index.js + page.md.js and inject script tags for
     // them as well so we fetch everything as early as possible without having
     // to wait for entry chunks to parse
-    ...resolvePageImports(config, page, result, indexChunk),
+    ...resolvePageImports(config, page, result, appChunk),
     pageClientJsFileName,
-    indexChunk.fileName
+    appChunk.fileName
   ]
     .map((file) => {
       return `<link rel="modulepreload" href="${assetPath}${file}">`
@@ -71,9 +67,7 @@ export async function renderPage(
   <body>
     <div id="app">${content}</div>
     <script>__VP_HASH_MAP__ = JSON.parse(${hashMapStirng})</script>
-    <script type="module" async src="${assetPath}${
-    indexChunk.fileName
-  }"></script>
+    <script type="module" async src="${assetPath}${appChunk.fileName}"></script>
   </body>
 </html>`.trim()
   const htmlFileName = path.join(config.outDir, page.replace(/\.md$/, '.html'))