@omg-dev/vite-plugin 0.4.40 → 0.4.42

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omg-dev/vite-plugin",
-  "version": "0.4.40",
+  "version": "0.4.42",
   "type": "module",
   "exports": {
     ".": {
@@ -15,8 +15,8 @@
     "build": "vp pack src/index.ts --no-fail-on-warn"
   },
   "dependencies": {
-    "@omg-dev/server": "0.4.40",
-    "@omg-dev/schema": "0.4.40",
+    "@omg-dev/server": "0.4.42",
+    "@omg-dev/schema": "0.4.42",
     "ws": "^8.18.0"
   },
   "devDependencies": {

package/src/build.ts

@@ -41,6 +41,9 @@ import { prerenderApp } from "./prerender.ts"
 const root = process.cwd()
 const vibesDir = path.join(root, ".vibes")
 const distDir = path.join(root, "dist")
+// TanStack Start's server build output. Its presence after the client build is
+// what puts this build in SSR mode (see step 4).
+const startServerEntry = path.join(distDir, "server", "server.js")
 
 // The build is not a runtime. Step 4b (prerender) spins up a nested Vite
 // dev server to SSR the app's root view, which — via the vibes vite-plugin's
@@ -189,6 +192,9 @@ async function main() {
   fs.writeFileSync(path.join(vibesDir, "workflows.generated.ts"), wfLines.join("\n"))
 
   // ── 3. write server.entry.ts ──────────────────────────────────────────────
+  // Deferred until after the client build (step 4) because the entry's shape
+  // depends on whether that build emitted an SPA or a Start SSR handler.
+  const writeServerEntry = (ssr: boolean) => {
   log("3/5 generating .vibes/server.entry.ts")
   const entry = [
     "// AUTO-GENERATED by @omg-dev/vite-plugin. Do not edit.",
@@ -201,6 +207,10 @@ async function main() {
     'import { routes } from "./routes.generated.ts"',
     'import { triggers } from "./triggers.generated.ts"',
     'import { workflows } from "./workflows.generated.ts"',
+    // Start's server build. bun build inlines it (and react, h3, seroval, …)
+    // into server.mjs, which is what lets the runtime keep its no-node_modules
+    // contract — the raw dist/server/server.js externalizes all of them.
+    ...(ssr ? ['import startServer from "../dist/server/server.js"'] : []),
     "",
     "const PORT = Number(process.env.PORT) || 3000",
     "",
@@ -212,7 +222,17 @@ async function main() {
     "  routes,",
     "  triggers,",
     "  workflows,",
-    "  staticDir: \"dist\",",
+    // Under SSR the browser assets live in dist/client and Start owns every
+    // HTML document, so serveStatic must NOT SPA-fallback — an unmatched path
+    // has to reach Start's fetch handler below to get a real 404 page or a
+    // server-rendered route.
+    ...(ssr
+      ? [
+          "  staticDir: \"dist/client\",",
+          "  staticFallthrough: true,",
+          "  notFound: (req) => startServer.fetch(req),",
+        ]
+      : ["  staticDir: \"dist\","]),
     "  // Migrations run at runtime (idempotent — diffs sqlite_master) so",
     "  // user data in .vibes/data.db persists across redeploys. The build",
     "  // artifact intentionally does NOT ship a seeded DB.",
@@ -290,6 +310,8 @@ async function main() {
     "        } },",
     "      )",
     "    }",
+    // Under SSR, unmatched requests reach Start via the `notFound` seam passed
+    // to createVibesServer above — so this stays one call in both modes.
     "    return vibes.fetch(req)",
     "  },",
     "  websocket: {",
@@ -323,12 +345,25 @@ async function main() {
     "",
   ].join("\n")
   fs.writeFileSync(path.join(vibesDir, "server.entry.ts"), entry)
+  }
 
   // ── 4. vite build (client) ────────────────────────────────────────────────
   log("4/5 vite build (client)")
   fs.rmSync(distDir, { recursive: true, force: true })
   run("bunx", ["--bun", "vp", "build"])
-  if (!fs.existsSync(path.join(distDir, "index.html"))) {
+
+  // SPA vs SSR is decided by what the build actually emitted, not by config
+  // parsing: TanStack Start emits dist/client/ + dist/server/server.js (a
+  // module whose default export is `{ fetch }`), where an SPA emits
+  // dist/index.html. Reading the output keeps this honest if Start changes
+  // its plugin API but keeps its output contract.
+  const ssr = fs.existsSync(startServerEntry)
+  if (ssr) {
+    if (!fs.existsSync(path.join(distDir, "client"))) {
+      die("SSR build produced dist/server/server.js but no dist/client/")
+    }
+    log("mode: SSR (TanStack Start) — dist/client + dist/server/server.js")
+  } else if (!fs.existsSync(path.join(distDir, "index.html"))) {
     die("vite build did not produce dist/index.html")
   }
 
@@ -337,8 +372,17 @@ async function main() {
   // Strictly additive and FAIL-SOFT (see prerender.ts): any failure leaves the
   // client build untouched, so it can never break a deploy. The client mounts
   // the full SPA over whatever HTML lands in #root.
-  log("4b/5 prerender (SSG, fail-soft)")
-  await prerenderApp({ root, distDir, vibesDir, log })
+  //
+  // Skipped under SSR: Start renders the document per request, so there is no
+  // #root shell to bake into and nothing to gain.
+  if (ssr) {
+    log("4b/5 prerender skipped (SSR renders every request)")
+  } else {
+    log("4b/5 prerender (SSG, fail-soft)")
+    await prerenderApp({ root, distDir, vibesDir, log })
+  }
+
+  writeServerEntry(ssr)
 
   // ── 5. bun build (server) ─────────────────────────────────────────────────
   log("5/5 bun build server")
@@ -382,7 +426,9 @@ async function main() {
   // causes data loss.
   // Workflows force a runtime VM: a static deploy has no server for the
   // engine to invoke, so workflow-only apps are NOT static.
-  const isStatic = !hasDb && routes.length === 0 && workflows.length === 0
+  // An SSR app is never static: object storage has no server to render the
+  // document, so serving dist/ directly would hand visitors a blank page.
+  const isStatic = !ssr && !hasDb && routes.length === 0 && workflows.length === 0
 
   // Serialize the app's @omg-dev/billing declaration (if any) into the manifest.
   // The orchestrator reads manifest.catalog at deploy time and persists it to
@@ -401,7 +447,9 @@ async function main() {
     static: isStatic,
     functions: routes.length,
     artifacts: [
-      { src: "dist", kind: "dir" },
+      // SSR ships only dist/client — dist/server was inlined into server.mjs
+      // by the bun build below, so shipping it again is dead weight.
+      { src: ssr ? "dist/client" : "dist", kind: "dir" },
       { src: ".vibes/server.mjs", kind: "file" },
     ],
     entry: ".vibes/server.mjs",

package/src/prerender.test.ts

@@ -0,0 +1,34 @@
+import { describe, expect, test } from "bun:test"
+import { isStaticPath, routeHtmlPath } from "./prerender.ts"
+
+describe("isStaticPath", () => {
+  test("keeps routes that resolve to exactly one URL", () => {
+    expect(isStaticPath("/")).toBe(true)
+    expect(isStaticPath("/pricing")).toBe(true)
+    expect(isStaticPath("/docs/getting-started")).toBe(true)
+  })
+
+  // A param route has no single URL to bake, so baking one would pin every
+  // /posts/* request to whichever id happened to render at build time.
+  test("drops param and splat routes", () => {
+    expect(isStaticPath("/posts/$postId")).toBe(false)
+    expect(isStaticPath("/files/$")).toBe(false)
+    expect(isStaticPath("/docs/*")).toBe(false)
+  })
+
+  test("drops anything that is not an absolute path", () => {
+    expect(isStaticPath("pricing")).toBe(false)
+    expect(isStaticPath("")).toBe(false)
+  })
+})
+
+describe("routeHtmlPath", () => {
+  // Directory-index form is load-bearing: it is what serveStatic in
+  // @omg-dev/server and the static-deploy path in proxy/deploy.go resolve.
+  // "pricing.html" would 404 into the SPA fallback and silently undo the bake.
+  test("maps / to the shell and every other route to a directory index", () => {
+    expect(routeHtmlPath("/app/dist", "/")).toBe("/app/dist/index.html")
+    expect(routeHtmlPath("/app/dist", "/pricing")).toBe("/app/dist/pricing/index.html")
+    expect(routeHtmlPath("/app/dist", "/docs/intro")).toBe("/app/dist/docs/intro/index.html")
+  })
+})

package/src/prerender.ts

@@ -1,26 +1,47 @@
 // Build-time prerender (SSG) for user apps.
 //
-// Renders the app's root view (<App/> from src/App.tsx) to static HTML at build
-// time and bakes it into dist/index.html, so crawlers + first paint see real
-// content instead of an empty SPA shell. The client (src/main.tsx, createRoot)
-// mounts the full app over whatever HTML is in #root — so behavior is identical
-// whether or not the prerender ran; it only changes the initial bytes.
+// Renders the app to static HTML at build time so crawlers + first paint see
+// real content instead of an empty SPA shell. The client (src/main.tsx,
+// createRoot) mounts the full app over whatever HTML is in #root — so behavior
+// is identical whether or not the prerender ran; it only changes the initial
+// bytes.
+//
+// Two modes, picked automatically:
+//
+//   router  — src/routeTree.gen.ts exists (TanStack Router, the default
+//             template since the router landed). Every STATIC route is
+//             rendered at its own path and written to dist/<path>/index.html,
+//             with "/" going to dist/index.html. This is why it matters: the
+//             static serving layers fall back to index.html for unknown paths,
+//             so a home-only bake would serve homepage markup for /pricing —
+//             wrong first paint, wrong SEO. Parameterized routes ($id, splats)
+//             are skipped; they keep the SPA fallback.
+//   app     — no route tree: render <App/> from src/App.tsx into
+//             dist/index.html. This is the pre-router behavior and every app
+//             created before the router still takes it, unchanged.
 //
 // FAIL-SOFT IS THE CONTRACT. This runs against arbitrary agent-generated code,
 // so anything can go wrong (a module-scope `window` reference, a render-time
 // throw, a missing App). Every failure path leaves dist/index.html exactly as
 // the client build produced it and returns normally — a prerender failure can
-// never fail a deploy. The worst case is "no prerender", never a broken page.
+// never fail a deploy. In router mode that guarantee is per-route: one route
+// that throws costs you that route's static HTML, nothing else. The worst case
+// is "no prerender", never a broken page.
 import fs from "node:fs"
 import path from "node:path"
 
 const ROOT_MARKER = '<div id="root"></div>'
 
+// Upper bound on how many routes we'll render in one build. A pathological
+// route tree shouldn't be able to stall a deploy; past this we bake the ones
+// we got and leave the rest on the SPA fallback.
+const MAX_ROUTES = 50
+
 export type PrerenderResult =
-  | { status: "baked"; bytes: number }
+  | { status: "baked"; bytes: number; routes?: number }
   | { status: "skipped"; reason: string }
 
-// Renders src/App.tsx to HTML and bakes it into dist/index.html. Never throws.
+// Renders the app to static HTML under distDir. Never throws.
 export async function prerenderApp(opts: {
   root: string
   distDir: string
@@ -32,8 +53,10 @@ export async function prerenderApp(opts: {
   const htmlPath = path.join(distDir, "index.html")
 
   try {
+    const routeTreePath = path.join(root, "src", "routeTree.gen.ts")
+    const routerMode = fs.existsSync(routeTreePath)
     const appPath = path.join(root, "src", "App.tsx")
-    if (!fs.existsSync(appPath)) {
+    if (!routerMode && !fs.existsSync(appPath)) {
       return done(log, { status: "skipped", reason: "src/App.tsx not found" })
     }
     if (!fs.existsSync(htmlPath)) {
@@ -45,24 +68,11 @@ export async function prerenderApp(opts: {
     }
 
     // Build-generated SSR entry — lives in .vibes/ so we never add a file to the
-    // user's src tree, and works for apps that predate this feature. Imports the
-    // conventional app root (default export of src/App.tsx) and renders it in the
-    // same StrictMode wrapper the client uses (src/main.tsx), so the baked markup
-    // matches the client's first render.
+    // user's src tree, and works for apps that predate this feature. Renders in
+    // the same StrictMode wrapper the client uses (src/main.tsx), so the baked
+    // markup matches the client's first render.
     const entryPath = path.join(vibesDir, "prerender.entry.tsx")
-    fs.writeFileSync(
-      entryPath,
-      [
-        "// AUTO-GENERATED by @omg-dev/vite-plugin. Do not edit.",
-        'import { StrictMode } from "react"',
-        'import { renderToString } from "react-dom/server"',
-        'import App from "../src/App.tsx"',
-        "export function render() {",
-        "  return renderToString(<StrictMode><App /></StrictMode>)",
-        "}",
-        "",
-      ].join("\n"),
-    )
+    fs.writeFileSync(entryPath, routerMode ? routerEntry() : appEntry())
 
     // Use the app's own Vite config (react plugin, @/ alias, @omg-dev/vite-plugin)
     // so SSR module resolution matches the client build. middlewareMode = no
@@ -77,15 +87,51 @@ export async function prerenderApp(opts: {
     })
     try {
       const mod = (await vite.ssrLoadModule("/.vibes/prerender.entry.tsx")) as {
-        render: () => string
+        render?: () => string
+        listPaths?: () => string[]
+        renderPath?: (p: string) => Promise<string>
+      }
+
+      if (!routerMode) {
+        const html = mod.render?.()
+        if (!html || !html.trim()) {
+          return done(log, { status: "skipped", reason: "empty render output" })
+        }
+        writeShell(htmlPath, shell, html)
+        return done(log, { status: "baked", bytes: html.length })
+      }
+
+      const all = mod.listPaths?.() ?? []
+      const paths = all.filter(isStaticPath).slice(0, MAX_ROUTES)
+      if (paths.length === 0) {
+        return done(log, { status: "skipped", reason: "no static routes in the route tree" })
+      }
+
+      let baked = 0
+      let bytes = 0
+      for (const p of paths) {
+        // Per-route fail-soft: a route that throws (loader hitting the network,
+        // a browser-only global at render time) simply doesn't get static HTML.
+        try {
+          const html = await mod.renderPath?.(p)
+          if (!html || !html.trim()) {
+            log(`prerender: – ${p} skipped (empty render output)`)
+            continue
+          }
+          writeShell(routeHtmlPath(distDir, p), shell, html)
+          baked++
+          bytes += html.length
+        } catch (err) {
+          log(`prerender: – ${p} skipped (${String(err).split("\n")[0]})`)
+        }
+      }
+      if (baked === 0) {
+        return done(log, { status: "skipped", reason: "every route failed to render" })
       }
-      const html = mod.render()
-      if (!html || !html.trim()) {
-        return done(log, { status: "skipped", reason: "empty render output" })
+      if (all.length > paths.length) {
+        log(`prerender: ${all.length - paths.length} dynamic/overflow route(s) left on the SPA fallback`)
       }
-      const out = shell.replace(ROOT_MARKER, `<div id="root">${html}</div>`)
-      fs.writeFileSync(htmlPath, out)
-      return done(log, { status: "baked", bytes: html.length })
+      return done(log, { status: "baked", bytes, routes: baked })
     } finally {
       await vite.close()
       fs.rmSync(entryPath, { force: true })
@@ -96,9 +142,74 @@ export async function prerenderApp(opts: {
   }
 }
 
+// "/" → dist/index.html, "/pricing" → dist/pricing/index.html. Directory-index
+// form (not "pricing.html") because that is what the static servers resolve —
+// see serveStatic in @omg-dev/server and the static-deploy path in
+// apps/infra/internal/proxy/deploy.go.
+export function routeHtmlPath(distDir: string, routePath: string): string {
+  if (routePath === "/") return path.join(distDir, "index.html")
+  return path.join(distDir, routePath.replace(/^\/+/, ""), "index.html")
+}
+
+function writeShell(outPath: string, shell: string, html: string): void {
+  fs.mkdirSync(path.dirname(outPath), { recursive: true })
+  fs.writeFileSync(outPath, shell.replace(ROOT_MARKER, `<div id="root">${html}</div>`))
+}
+
+// Only routes that resolve to exactly one URL can be baked to a file. Anything
+// with a param ($id), a splat, or a pathless/layout marker is left alone.
+export function isStaticPath(p: string): boolean {
+  if (!p.startsWith("/")) return false
+  if (p.includes("$") || p.includes("*")) return false
+  return true
+}
+
+function appEntry(): string {
+  return [
+    "// AUTO-GENERATED by @omg-dev/vite-plugin. Do not edit.",
+    'import { StrictMode } from "react"',
+    'import { renderToString } from "react-dom/server"',
+    'import App from "../src/App.tsx"',
+    "export function render() {",
+    "  return renderToString(<StrictMode><App /></StrictMode>)",
+    "}",
+    "",
+  ].join("\n")
+}
+
+function routerEntry(): string {
+  return [
+    "// AUTO-GENERATED by @omg-dev/vite-plugin. Do not edit.",
+    'import { StrictMode } from "react"',
+    'import { renderToString } from "react-dom/server"',
+    'import { RouterProvider, createRouter, createMemoryHistory } from "@tanstack/react-router"',
+    'import { routeTree } from "../src/routeTree.gen"',
+    "",
+    "// Every URL the route tree can resolve, params included — the caller",
+    "// filters down to the static ones.",
+    "export function listPaths() {",
+    "  const router = createRouter({ routeTree })",
+    "  return Object.keys(router.routesByPath ?? {})",
+    "}",
+    "",
+    "// A fresh router per path: routers carry resolved match state, so reusing",
+    "// one across paths would bleed the previous route's markup into the next.",
+    "export async function renderPath(pathname) {",
+    "  const router = createRouter({",
+    "    routeTree,",
+    "    history: createMemoryHistory({ initialEntries: [pathname] }),",
+    "  })",
+    "  await router.load()",
+    "  return renderToString(<StrictMode><RouterProvider router={router} /></StrictMode>)",
+    "}",
+    "",
+  ].join("\n")
+}
+
 function done(log: (m: string) => void, r: PrerenderResult): PrerenderResult {
   if (r.status === "baked") {
-    log(`prerender: ✓ baked app root into dist/index.html (+${r.bytes}B static HTML)`)
+    const where = r.routes ? `${r.routes} route(s)` : "dist/index.html"
+    log(`prerender: ✓ baked app root into ${where} (+${r.bytes}B static HTML)`)
   } else {
     log(`prerender: SPA shell kept (no prerender) — ${r.reason}`)
   }