feat: fix production build and entry-server SSR pattern

- build.ts: use createBuilder() + buildApp() for multi-environment build
  (client, SSR, Nitro all build correctly)
- entry-server.tsx: rewrite as Nitro server entry with export default { fetch }
  using renderToReadableStream, asset injection via ?assets imports
- source.ts: use @content/ alias in import() so Vite bundles MDX at build time
  (removes @vite-ignore, fixes ERR_UNKNOWN_FILE_EXTENSION in production)
- source.ts: check file exists before import to prevent crashes
- Remove index.html template (entry-server renders full HTML)
- Remove catch-all route (entry-server handles SSR)
- Remove serverDir from Nitro config (entry-server pattern)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: rsbh

packages/chronicle/src/cli/commands/build.ts

@@ -17,7 +17,7 @@ export const buildCommand = new Command('build')
 
     console.log(chalk.cyan('Building for production...'));
 
-    const { build } = await import('vite');
+    const { createBuilder } = await import('vite');
     const { createViteConfig } = await import('@/server/vite-config');
 
     const config = await createViteConfig({
@@ -27,7 +27,8 @@ export const buildCommand = new Command('build')
       preset: options.preset
     });
 
-    await build(config);
+    const builder = await createBuilder({ ...config, builder: {} });
+    await builder.buildApp();
 
     console.log(chalk.green('Build complete'));
   });

packages/chronicle/src/lib/source.ts

@@ -117,10 +117,17 @@ export async function loadPageComponent(
   page: SourcePage
 ): Promise<MDXContent | null> {
   if (!page.filePath) return null;
+  try {
+    await fs.access(page.filePath);
+  } catch {
+    return null;
+  }
   const contentDir = getContentDir();
   const relativePath = path.relative(contentDir, page.filePath);
-  const symlinkPath = path.join(__CHRONICLE_PACKAGE_ROOT__, '.content', relativePath);
-  const mod = await import(/* @vite-ignore */ symlinkPath);
+  const withoutExt = relativePath.replace(/\.(mdx|md)$/, '');
+  const mod = relativePath.endsWith('.md')
+    ? await import(`@content/${withoutExt}.md`)
+    : await import(`@content/${withoutExt}.mdx`);
   return mod.default;
 }
 

packages/chronicle/src/server/entry-server.tsx

@@ -1,49 +1,95 @@
-import { PassThrough } from 'node:stream';
-import type { ReactNode } from 'react';
-import { renderToPipeableStream } from 'react-dom/server';
+import '@raystack/apsara/normalize.css';
+import '@raystack/apsara/style.css';
+import path from 'node:path';
+import React from 'react';
+import { renderToReadableStream } from 'react-dom/server.edge';
 import { StaticRouter } from 'react-router';
-import type { ApiSpec } from '@/lib/openapi';
+import { mdxComponents } from '@/components/mdx';
+import { loadConfig } from '@/lib/config';
+import { loadApiSpecs } from '@/lib/openapi';
 import { PageProvider } from '@/lib/page-context';
-import type { ChronicleConfig, Frontmatter, PageTree } from '@/types';
+import { buildPageTree, getPage, loadPageComponent } from '@/lib/source';
 import { App } from './App';
 
-export interface SSRData {
-  config: ChronicleConfig;
-  tree: PageTree;
-  page: {
-    slug: string[];
-    frontmatter: Frontmatter;
-    content: ReactNode;
-  } | null;
-  apiSpecs: ApiSpec[];
-}
-
-export function render(url: string, data: SSRData): Promise<string> {
-  const pathname = new URL(url, 'http://localhost').pathname;
-
-  return new Promise((resolve, reject) => {
-    const chunks: Buffer[] = [];
-    const { pipe } = renderToPipeableStream(
-      <StaticRouter location={pathname}>
-        <PageProvider
-          initialConfig={data.config}
-          initialTree={data.tree}
-          initialPage={data.page}
-          initialApiSpecs={data.apiSpecs}
-        >
-          <App />
-        </PageProvider>
-      </StaticRouter>,
-      {
-        onAllReady() {
-          const passthrough = new PassThrough();
-          passthrough.on('data', (chunk: Buffer) => chunks.push(chunk));
-          passthrough.on('end', () => resolve(Buffer.concat(chunks).toString()));
-          passthrough.on('error', reject);
-          pipe(passthrough);
-        },
-        onError: reject,
-      }
+// @ts-expect-error virtual import from Nitro
+import clientAssets from './entry-client?assets=client';
+// @ts-expect-error virtual import from Nitro
+import serverAssets from './entry-server?assets=ssr';
+
+export default {
+  async fetch(req: Request) {
+    const url = new URL(req.url);
+    const pathname = url.pathname;
+    const slug = pathname === '/' ? [] : pathname.slice(1).split('/').filter(Boolean);
+
+    const config = loadConfig();
+    const apiSpecs = config.api?.length
+      ? await loadApiSpecs(config.api).catch(() => [])
+      : [];
+
+    const [tree, sourcePage] = await Promise.all([
+      buildPageTree(),
+      getPage(slug),
+    ]);
+
+    const pageData = sourcePage
+      ? {
+          slug,
+          frontmatter: sourcePage.frontmatter,
+          content: await loadPageComponent(sourcePage).then(component =>
+            component ? React.createElement(component, { components: mdxComponents }) : null
+          ),
+        }
+      : null;
+
+    const relativePath = sourcePage
+      ? path.relative(__CHRONICLE_CONTENT_DIR__, sourcePage.filePath)
+      : null;
+
+    const embeddedData = {
+      config,
+      tree,
+      slug,
+      frontmatter: pageData?.frontmatter ?? null,
+      relativePath,
+    };
+    const safeJson = JSON.stringify(embeddedData).replace(/</g, '\\u003c');
+
+    const assets = clientAssets.merge(serverAssets);
+
+    const stream = await renderToReadableStream(
+      <html lang="en">
+        <head>
+          <meta charSet="UTF-8" />
+          <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+          {assets.css.map((attr: { href: string }) => (
+            <link key={attr.href} rel="stylesheet" {...attr} />
+          ))}
+          {assets.js.map((attr: { href: string }) => (
+            <link key={attr.href} rel="modulepreload" {...attr} />
+          ))}
+          <script type="module" src={assets.entry} />
+          <script dangerouslySetInnerHTML={{ __html: `window.__PAGE_DATA__ = ${safeJson}` }} />
+        </head>
+        <body>
+          <div id="root">
+            <StaticRouter location={pathname}>
+              <PageProvider
+                initialConfig={config}
+                initialTree={tree}
+                initialPage={pageData}
+                initialApiSpecs={apiSpecs}
+              >
+                <App />
+              </PageProvider>
+            </StaticRouter>
+          </div>
+        </body>
+      </html>,
     );
-  });
-}
+
+    return new Response(stream, {
+      headers: { 'Content-Type': 'text/html;charset=utf-8' },
+    });
+  },
+};

packages/chronicle/src/server/index.html

@@ -23,7 +23,6 @@ export async function createViteConfig(
       nitro({
         serverDir: path.resolve(packageRoot, 'src/server'),
         ...(preset && { preset }),
-        noExternals: true,
       }),
       mdx({}, { index: false }),
       react()