@jasonshimmy/vite-plugin-cer-app 0.1.6 → 0.3.0

package/dist/runtime/app-template.js

@@ -0,0 +1,159 @@
+/**
+ * Template string for `.cer/app.ts` — the framework client entry point.
+ *
+ * Always written to `.cer/app.ts` on every dev/build so consumers
+ * automatically receive the latest bootstrap code on plugin update.
+ * This file is gitignored and should never be edited directly.
+ */
+export const APP_ENTRY_TEMPLATE = `// AUTO-GENERATED by @jasonshimmy/vite-plugin-cer-app — do not edit.
+// Regenerated automatically on every dev server start and build.
+
+import '@jasonshimmy/custom-elements-runtime/css'
+import 'virtual:cer-jit-css'
+import 'virtual:cer-components'
+import routes from 'virtual:cer-routes'
+import layouts from 'virtual:cer-layouts'
+import plugins from 'virtual:cer-plugins'
+import { hasLoading, loadingTag } from 'virtual:cer-loading'
+import { hasError, errorTag } from 'virtual:cer-error'
+import {
+  component,
+  ref,
+  provide,
+  useOnConnected,
+  useOnDisconnected,
+  registerBuiltinComponents,
+} from '@jasonshimmy/custom-elements-runtime'
+import { initRouter } from '@jasonshimmy/custom-elements-runtime/router'
+import { enableJITCSS } from '@jasonshimmy/custom-elements-runtime/jit-css'
+
+registerBuiltinComponents()
+enableJITCSS()
+
+const router = initRouter({ routes })
+
+// ─── Navigation state ────────────────────────────────────────────────────────
+
+const isNavigating = ref(false)
+const currentError = ref(null)
+
+const resetError = (): void => {
+  currentError.value = null
+  void router.replace(router.getCurrent().path)
+}
+;(globalThis as Record<string, unknown>).resetError = resetError
+
+const _push = router.push.bind(router)
+const _replace = router.replace.bind(router)
+
+router.push = async (path) => {
+  isNavigating.value = true
+  currentError.value = null
+  try {
+    await _push(path)
+  } catch (err) {
+    currentError.value = err instanceof Error ? err.message : String(err)
+  } finally {
+    isNavigating.value = false
+  }
+}
+
+router.replace = async (path) => {
+  isNavigating.value = true
+  currentError.value = null
+  try {
+    await _replace(path)
+  } catch (err) {
+    currentError.value = err instanceof Error ? err.message : String(err)
+  } finally {
+    isNavigating.value = false
+  }
+}
+
+// ─── Plugins ─────────────────────────────────────────────────────────────────
+
+// Collect plugin-provided values so cer-layout-view can forward them into
+// the component context tree via the real provide() hook (which inject() walks).
+// Declared BEFORE component('cer-layout-view') to avoid a temporal dead zone
+// ReferenceError: customElements.define() upgrades existing DOM elements
+// synchronously, calling the render function immediately.
+const _pluginProvides = new Map<string, unknown>()
+// Expose plugin provides globally so page components can read them synchronously
+// regardless of render order.
+;(globalThis as Record<string, unknown>).__cerPluginProvides = _pluginProvides
+
+// ─── <cer-layout-view> ───────────────────────────────────────────────────────
+
+component('cer-layout-view', () => {
+  // Forward plugin-provided values into the component context so inject() in
+  // any descendant component can resolve them by walking up the DOM tree.
+  for (const [key, value] of _pluginProvides) {
+    provide(key, value)
+  }
+
+  const current = ref(router.getCurrent())
+  let unsub: (() => void) | undefined
+
+  useOnConnected(() => {
+    unsub = router.subscribe((s: typeof current.value) => { current.value = s })
+  })
+  useOnDisconnected(() => { unsub?.(); unsub = undefined })
+
+  if (currentError.value !== null) {
+    if (hasError && errorTag) {
+      return { tag: errorTag, props: { attrs: { error: String(currentError.value) } }, children: [] }
+    }
+    return { tag: 'div', props: { attrs: { style: 'padding:2rem;font-family:monospace' } }, children: String(currentError.value) }
+  }
+
+  if (isNavigating.value && hasLoading && loadingTag) {
+    return { tag: loadingTag, props: {}, children: [] }
+  }
+
+  const matched = router.matchRoute(current.value.path)
+  const routeMeta = matched?.route?.meta as { layout?: string } | undefined
+  const layoutName = routeMeta?.layout ?? 'default'
+  const layoutTag = (layouts as Record<string, string>)[layoutName]
+  const routerView = { tag: 'router-view', props: {}, children: [] }
+
+  if (layoutTag) return { tag: layoutTag, props: {}, children: [routerView] }
+  return routerView
+})
+
+for (const plugin of plugins) {
+  if (plugin && typeof plugin.setup === 'function') {
+    await plugin.setup({
+      router,
+      provide: (key: string, value: unknown) => { _pluginProvides.set(key, value) },
+      config: {},
+    })
+  }
+}
+
+// ─── Pre-load initial route ───────────────────────────────────────────────────
+// Download the current page's route chunk AFTER plugins run so that
+// cer-layout-view's first render (which calls provide()) completes before
+// page components are defined and their renders are scheduled. This ensures
+// inject() in child components can find values stored by provide().
+
+if (typeof window !== 'undefined') {
+  const _initMatch = router.matchRoute(window.location.pathname)
+  if (_initMatch?.route?.load) {
+    try { await _initMatch.route.load() } catch { /* non-fatal */ }
+  }
+}
+
+// ─── Initial navigation ──────────────────────────────────────────────────────
+
+if (typeof window !== 'undefined') {
+  // Use the original (unwrapped) replace so isNavigating stays false during
+  // the initial paint — the loading component must not flash over pre-rendered content.
+  await _replace(window.location.pathname + window.location.search + window.location.hash)
+  // Clear SSR loader data after initial navigation so subsequent client-side
+  // navigations don't accidentally reuse stale server data.
+  delete (globalThis as Record<string, unknown>).__CER_DATA__
+}
+
+export { router }
+`;
+//# sourceMappingURL=app-template.js.map

package/dist/runtime/app-template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-template.js","sourceRoot":"","sources":["../../src/runtime/app-template.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsJjC,CAAA"}

package/dist/types/config.d.ts

@@ -10,7 +10,6 @@ export interface JitCssConfig {
 }
 export interface SsrConfig {
     dsd?: boolean;
-    streaming?: boolean;
 }
 export interface AutoImportsConfig {
     components?: boolean;

package/dist/types/config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/types/config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,6CAA6C,CAAA;AAE/E,MAAM,WAAW,SAAS;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,YAAY;IAC3B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED,MAAM,WAAW,SAAS;IACxB,GAAG,CAAC,EAAE,OAAO,CAAA;IACb,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAED,MAAM,WAAW,iBAAiB;IAChC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,CAAC,EAAE,KAAK,GAAG,KAAK,GAAG,KAAK,CAAA;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,GAAG,CAAC,EAAE,SAAS,CAAA;IACf,MAAM,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,kBAAkB,CAAC,CAAA;IACxD,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,GAAG,CAAC,EAAE,SAAS,CAAA;IACf,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,wBAAgB,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,YAAY,CAE/D"}
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/types/config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,6CAA6C,CAAA;AAE/E,MAAM,WAAW,SAAS;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,YAAY;IAC3B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED,MAAM,WAAW,SAAS;IACxB,GAAG,CAAC,EAAE,OAAO,CAAA;CACd;AAED,MAAM,WAAW,iBAAiB;IAChC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,CAAC,EAAE,KAAK,GAAG,KAAK,GAAG,KAAK,CAAA;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,GAAG,CAAC,EAAE,SAAS,CAAA;IACf,MAAM,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,kBAAkB,CAAC,CAAA;IACxD,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,GAAG,CAAC,EAAE,SAAS,CAAA;IACf,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,wBAAgB,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,YAAY,CAE/D"}

package/dist/types/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","sourceRoot":"","sources":["../../src/types/config.ts"],"names":[],"mappings":"AAoCA,MAAM,UAAU,YAAY,CAAC,MAAoB;IAC/C,OAAO,MAAM,CAAA;AACf,CAAC"}
+{"version":3,"file":"config.js","sourceRoot":"","sources":["../../src/types/config.ts"],"names":[],"mappings":"AAmCA,MAAM,UAAU,YAAY,CAAC,MAAoB;IAC/C,OAAO,MAAM,CAAA;AACf,CAAC"}

package/docs/cli.md

@@ -187,7 +187,7 @@ my-app/
 | Mode | `cer.config.ts` | `package.json` scripts |
 |---|---|---|
 | SPA | `mode: 'spa'` | `dev`, `build`, `preview` |
-| SSR | `mode: 'ssr'`, `ssr.streaming: true` | `dev`, `build`, `preview --ssr` |
+| SSR | `mode: 'ssr'`, `ssr.dsd: true` | `dev`, `build`, `preview --ssr` |
 | SSG | `mode: 'ssg'`, `ssg.routes: 'auto'` | `dev`, `build`, `preview`, `generate` |
 
 ---

package/docs/configuration.md

@@ -13,7 +13,6 @@ export default defineConfig({
 
   ssr: {
     dsd: true,
-    streaming: false,
   },
 
   ssg: {
@@ -87,8 +86,7 @@ Controls SSR rendering behavior.
 
 ```ts
 ssr: {
-  dsd: true,       // Emit Declarative Shadow DOM
-  streaming: false // Use streaming renderer (createStreamingSSRHandler)
+  dsd: true, // Emit Declarative Shadow DOM
 }
 ```
 
@@ -99,13 +97,6 @@ ssr: {
 
 When `true`, renders components with [Declarative Shadow DOM](https://developer.chrome.com/docs/css-ui/declarative-shadow-dom) markup. This eliminates Flash of Unstyled Content (FOUC) because styles are embedded directly in the HTML.
 
-### `ssr.streaming`
-
-**Type:** `boolean`
-**Default:** `false`
-
-When `true`, uses the streaming SSR renderer (`createStreamingSSRHandler`) to progressively flush HTML to the client. When `false`, collects the full HTML string before sending.
-
 ---
 
 ## `ssg` options
@@ -247,7 +238,7 @@ export default defineConfig({
   plugins: [
     cerApp({
       mode: 'ssr',
-      ssr: { dsd: true, streaming: true },
+      ssr: { dsd: true },
     }),
   ],
 })

package/docs/getting-started.md

@@ -128,110 +128,12 @@ component('layout-default', () => {
   </head>
   <body>
     <cer-layout-view></cer-layout-view>
-    <script type="module" src="/app/app.ts"></script>
+    <script type="module" src="/.cer/app.ts"></script>
   </body>
 </html>
 ```
 
-### 7. Create `app/app.ts` (auto-generated if absent)
-
-The framework generates this file when you scaffold a new project. It bootstraps the router, registers all auto-discovered components, runs plugins, and mounts the app:
-
-```ts
-// app/app.ts
-import '@jasonshimmy/custom-elements-runtime/css'
-import 'virtual:cer-jit-css'
-import 'virtual:cer-components'
-import routes from 'virtual:cer-routes'
-import layouts from 'virtual:cer-layouts'
-import plugins from 'virtual:cer-plugins'
-import { hasLoading, loadingTag } from 'virtual:cer-loading'
-import { hasError, errorTag } from 'virtual:cer-error'
-import {
-  component, ref, provide,
-  useOnConnected, useOnDisconnected,
-  registerBuiltinComponents,
-} from '@jasonshimmy/custom-elements-runtime'
-import { initRouter } from '@jasonshimmy/custom-elements-runtime/router'
-import { enableJITCSS } from '@jasonshimmy/custom-elements-runtime/jit-css'
-
-registerBuiltinComponents()
-enableJITCSS()
-
-const router = initRouter({ routes })
-
-const isNavigating = ref(false)
-const currentError = ref(null)
-;(globalThis as any).resetError = () => {
-  currentError.value = null
-  router.replace(router.getCurrent().path)
-}
-
-const _push = router.push.bind(router)
-const _replace = router.replace.bind(router)
-router.push = async (path) => {
-  isNavigating.value = true; currentError.value = null
-  try { await _push(path) } catch (err) { currentError.value = err instanceof Error ? err.message : String(err) } finally { isNavigating.value = false }
-}
-router.replace = async (path) => {
-  isNavigating.value = true; currentError.value = null
-  try { await _replace(path) } catch (err) { currentError.value = err instanceof Error ? err.message : String(err) } finally { isNavigating.value = false }
-}
-
-// _pluginProvides is populated by plugin setup and forwarded into the component
-// context tree via provide() inside cer-layout-view so inject() works in all modes.
-// Also exposed on globalThis for the SSG timing edge case — see docs/plugins.md.
-const _pluginProvides = new Map<string, unknown>()
-;(globalThis as any).__cerPluginProvides = _pluginProvides
-
-component('cer-layout-view', () => {
-  for (const [key, value] of _pluginProvides) { provide(key, value) }
-
-  const current = ref(router.getCurrent())
-  let unsub: (() => void) | undefined
-  useOnConnected(() => { unsub = router.subscribe((s) => { current.value = s }) })
-  useOnDisconnected(() => { unsub?.(); unsub = undefined })
-
-  if (currentError.value !== null) {
-    if (hasError && errorTag) return { tag: errorTag, props: { attrs: { error: String(currentError.value) } }, children: [] }
-    return { tag: 'div', props: { attrs: { style: 'padding:2rem;font-family:monospace' } }, children: String(currentError.value) }
-  }
-  if (isNavigating.value && hasLoading && loadingTag) return { tag: loadingTag, props: {}, children: [] }
-
-  const matched = router.matchRoute(current.value.path)
-  const layoutName = (matched?.route as any)?.meta?.layout ?? 'default'
-  const layoutTag = (layouts as Record<string, string>)[layoutName]
-  const routerView = { tag: 'router-view', props: {}, children: [] }
-  return layoutTag ? { tag: layoutTag, props: {}, children: [routerView] } : routerView
-})
-
-// Plugins run AFTER cer-layout-view is defined so provide() calls from plugins
-// are forwarded into the component tree on the very first render.
-for (const plugin of plugins ?? []) {
-  if (plugin && typeof plugin.setup === 'function') {
-    await plugin.setup({ router, provide: (key, value) => { _pluginProvides.set(key, value) }, config: {} })
-  }
-}
-
-// Pre-load the current page's route chunk AFTER plugins run.
-// This ensures cer-layout-view's first render (and its provide() calls) completes
-// before page component modules are imported and their renders are scheduled.
-if (typeof window !== 'undefined') {
-  const _initMatch = router.matchRoute(window.location.pathname)
-  if (_initMatch?.route?.load) {
-    try { await _initMatch.route.load() } catch { /* non-fatal */ }
-  }
-}
-
-if (typeof window !== 'undefined') {
-  await _replace(window.location.pathname + window.location.search + window.location.hash)
-  delete (globalThis as any).__CER_DATA__
-}
-
-export { router }
-```
-
-> **Note:** Do not move the plugin loop before `component('cer-layout-view', …)`. The layout component must be defined first so that when plugins call `app.provide()`, the values are available to the component tree from the very first render. See [Plugins](plugins.md) for details.
+> **Note:** The framework bootstrap lives in `.cer/app.ts` and is regenerated automatically on every dev server start and build. You never edit or own this file — updates to the plugin propagate to it immediately, just like Nuxt's `.nuxt/` directory.
 
 ---
 

package/docs/rendering-modes.md

@@ -63,9 +63,9 @@ The server renders HTML for each request. Uses Declarative Shadow DOM (DSD) to e
 3. API route handlers run if the URL matches `/api/`
 4. For HTML requests, the router matches the URL to a page
 5. The page's `loader` is called (if present)
-6. The component tree is rendered to HTML via `createStreamingSSRHandler`
+6. The component tree is rendered to HTML with Declarative Shadow DOM via `renderToStringWithJITCSSDSD`
 7. `useHead()` calls are collected and injected before `</head>`
-8. The response is streamed or sent in full
+8. The rendered HTML is merged with the Vite client bundle shell and sent as a full response
 
 ### Build output
 
@@ -93,8 +93,7 @@ export default handler
 export default defineConfig({
   mode: 'ssr',
   ssr: {
-    dsd: true,        // Declarative Shadow DOM (eliminates FOUC)
-    streaming: false, // true = stream response; false = buffer full HTML
+    dsd: true, // Declarative Shadow DOM (eliminates FOUC)
   },
 })
 ```
@@ -242,7 +241,7 @@ Any CDN or static host. Upload the entire `dist/` directory (excluding `dist/ser
 | Dynamic routes | Yes | Yes | Requires `ssg.paths` |
 | API routes | Separate deploy | Same process | Separate deploy |
 | `useHead()` SSR injection | No | Yes | Yes |
-| Streaming | No | Optional | No |
+| Streaming | No | No | No |
 
 ---
 

package/docs/routing.md

@@ -10,7 +10,7 @@ Routes are automatically derived from files in the `app/pages/` directory. No ma
 |---|---|---|
 | `app/pages/index.ts` | `/` | `page-index` |
 | `app/pages/about.ts` | `/about` | `page-about` |
-| `app/pages/blog/index.ts` | `/blog` | `page-blog-index` |
+| `app/pages/blog/index.ts` | `/blog` | `page-blog` |
 | `app/pages/blog/[slug].ts` | `/blog/:slug` | `page-blog-slug` |
 | `app/pages/users/[id]/edit.ts` | `/users/:id/edit` | `page-users-id-edit` |
 | `app/pages/404.ts` | `/:all*` (catch-all) | `page-404` |

package/e2e/kitchen-sink/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "./.cer/tsconfig.json"
+}

package/eslint.config.ts

@@ -0,0 +1,22 @@
+import tseslint from 'typescript-eslint'
+
+export default tseslint.config(
+  {
+    ignores: [
+      'dist/**',
+      'node_modules/**',
+      'coverage/**',
+      'e2e/**',
+      'src/__tests__/**',
+      'src/cli/create/templates/**',
+    ],
+  },
+  {
+    files: ['src/**/*.ts'],
+    extends: [...tseslint.configs.recommended],
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'error',
+      '@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_', varsIgnorePattern: '^_' }],
+    },
+  },
+)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jasonshimmy/vite-plugin-cer-app",
-  "version": "0.1.6",
+  "version": "0.3.0",
   "description": "Nuxt-style meta-framework for @jasonshimmy/custom-elements-runtime",
   "type": "module",
   "keywords": [
@@ -44,8 +44,10 @@
     "create-cer-app": "./dist/cli/create/index.js"
   },
   "scripts": {
+    "validate": "npm run lint && npm test && npm run build && npm run e2e",
     "build": "tsc -p tsconfig.build.json && cp -r src/cli/create/templates dist/cli/create/templates",
     "dev": "tsc -p tsconfig.build.json --watch",
+    "lint": "eslint",
     "test": "vitest run",
     "test:watch": "vitest",
     "test:coverage": "vitest run --coverage",
@@ -80,9 +82,12 @@
     "@types/node": "^25.5.0",
     "@vitest/coverage-v8": "^4.1.0",
     "cypress": "^15.12.0",
+    "eslint": "^10.0.3",
     "happy-dom": "^20.8.4",
+    "jiti": "^2.6.1",
     "start-server-and-test": "^2.1.5",
     "typescript": "^5.9.3",
+    "typescript-eslint": "^8.57.1",
     "vite": "^8.0.1",
     "vitest": "^4.1.0"
   },

package/src/__tests__/plugin/build-ssr.test.ts

@@ -6,11 +6,16 @@ import { resolve } from 'pathe'
 // The `buildSSR` function itself invokes Vite's `build` API which we don't
 // need to exercise in unit tests (it's an integration concern).
 vi.mock('vite', () => ({ build: vi.fn().mockResolvedValue(undefined) }))
+vi.mock('../../plugin/generated-dir.js', () => ({
+  writeGeneratedDir: vi.fn(),
+  getGeneratedDir: vi.fn().mockReturnValue('/project/.cer'),
+  GENERATED_DIR_NAME: '.cer',
+}))
 // Partial mock: keep the real readFileSync/existsSync but allow overrides in
 // individual describe blocks if needed.
 vi.mock('node:fs', async (importOriginal) => {
   const actual = await importOriginal<typeof import('node:fs')>()
-  return { ...actual, existsSync: vi.fn().mockReturnValue(true) }
+  return { ...actual, existsSync: vi.fn().mockReturnValue(true), renameSync: vi.fn() }
 })
 
 import type { ResolvedCerConfig } from '../../plugin/dev-server.js'
@@ -202,24 +207,33 @@ describe('buildSSR — resolveClientEntry fallbacks', () => {
   })
 
   it('uses index.html when it exists', async () => {
-    existsSyncMock.mockReturnValue(true) // index.html exists
+    existsSyncMock.mockImplementation((p: unknown) => String(p).endsWith('index.html'))
     await buildSSR(makeConfig())
-    const clientInput = (buildMock.mock.calls[0][0] as any).build.rollupOptions.input
-    expect(clientInput).toMatch(/index\.html$/)
+    const clientInput = (buildMock.mock.calls[0][0] as Record<string, unknown>)
+    expect(((clientInput.build as Record<string, unknown>).rollupOptions as Record<string, unknown>).input).toMatch(/(?<!\.cer\/)index\.html$/)
   })
 
-  it('falls back to entry-client.ts when index.html is absent', async () => {
+  it('falls back to .cer/index.html when root index.html is absent', async () => {
+    existsSyncMock.mockImplementation((p: unknown) =>
+      String(p).endsWith('.cer/index.html'),
+    )
+    await buildSSR(makeConfig())
+    const clientInput = (buildMock.mock.calls[0][0] as Record<string, unknown>)
+    expect(((clientInput.build as Record<string, unknown>).rollupOptions as Record<string, unknown>).input).toMatch(/\.cer\/index\.html$/)
+  })
+
+  it('falls back to entry-client.ts when no index.html exists', async () => {
     existsSyncMock.mockImplementation((p: unknown) => String(p).endsWith('entry-client.ts'))
     await buildSSR(makeConfig())
-    const clientInput = (buildMock.mock.calls[0][0] as any).build.rollupOptions.input
-    expect(clientInput).toMatch(/entry-client\.ts$/)
+    const clientInput = (buildMock.mock.calls[0][0] as Record<string, unknown>)
+    expect(((clientInput.build as Record<string, unknown>).rollupOptions as Record<string, unknown>).input).toMatch(/entry-client\.ts$/)
   })
 
-  it('falls back to app.ts when neither index.html nor entry-client.ts exist', async () => {
+  it('falls back to app.ts when nothing else exists', async () => {
     existsSyncMock.mockReturnValue(false)
     await buildSSR(makeConfig())
-    const clientInput = (buildMock.mock.calls[0][0] as any).build.rollupOptions.input
-    expect(clientInput).toMatch(/app\.ts$/)
+    const clientInput = (buildMock.mock.calls[0][0] as Record<string, unknown>)
+    expect(((clientInput.build as Record<string, unknown>).rollupOptions as Record<string, unknown>).input).toMatch(/app\.ts$/)
   })
 })
 

package/src/__tests__/plugin/cer-app-plugin.test.ts

@@ -3,6 +3,10 @@ import { vi, describe, it, expect, beforeEach } from 'vitest'
 vi.mock('@jasonshimmy/custom-elements-runtime/vite-plugin', () => ({
   cerPlugin: vi.fn().mockReturnValue([{ name: 'cer-runtime-plugin' }]),
 }))
+vi.mock('node:fs', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('node:fs')>()
+  return { ...actual, existsSync: vi.fn().mockReturnValue(true), readFileSync: vi.fn().mockReturnValue('') }
+})
 vi.mock('../../plugin/dev-server.js', () => ({
   configureCerDevServer: vi.fn().mockResolvedValue(undefined),
 }))
@@ -15,6 +19,11 @@ vi.mock('../../plugin/dts-generator.js', () => ({
   writeAutoImportDts: vi.fn().mockResolvedValue(undefined),
   writeTsconfigPaths: vi.fn(),
 }))
+vi.mock('../../plugin/generated-dir.js', () => ({
+  writeGeneratedDir: vi.fn(),
+  getGeneratedDir: vi.fn().mockReturnValue('/project/.cer'),
+  GENERATED_DIR_NAME: '.cer',
+}))
 vi.mock('../../plugin/virtual/routes.js', () => ({ generateRoutesCode: vi.fn().mockResolvedValue('// routes') }))
 vi.mock('../../plugin/virtual/layouts.js', () => ({ generateLayoutsCode: vi.fn().mockResolvedValue('// layouts') }))
 vi.mock('../../plugin/virtual/components.js', () => ({ generateComponentsCode: vi.fn().mockResolvedValue('// components') }))
@@ -263,6 +272,16 @@ describe('cerApp plugin — transform hook', () => {
 })
 
 describe('cerApp plugin — buildStart hook', () => {
+  it('calls writeGeneratedDir on build start', async () => {
+    const { writeGeneratedDir } = await import('../../plugin/generated-dir.js')
+    vi.mocked(writeGeneratedDir).mockClear()
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'build', mode: 'production' })
+    plugin.configResolved(FAKE_RESOLVED)
+    await plugin.buildStart()
+    expect(writeGeneratedDir).toHaveBeenCalledTimes(1)
+  })
+
   it('calls scanComposableExports on build start', async () => {
     const { scanComposableExports } = await import('../../plugin/dts-generator.js')
     vi.mocked(scanComposableExports).mockClear()
@@ -295,6 +314,22 @@ describe('cerApp plugin — buildStart hook', () => {
 })
 
 describe('cerApp plugin — configureServer hook', () => {
+  it('calls writeGeneratedDir on server configure', async () => {
+    const { writeGeneratedDir } = await import('../../plugin/generated-dir.js')
+    vi.mocked(writeGeneratedDir).mockClear()
+    const plugin = getCerPlugin()
+    plugin.config({ root: '/project' }, { command: 'serve', mode: 'development' })
+    plugin.configResolved(FAKE_RESOLVED)
+    const mockServer = {
+      watcher: { on: vi.fn() },
+      moduleGraph: { getModuleById: vi.fn().mockReturnValue(null), invalidateModule: vi.fn() },
+      ws: { send: vi.fn() },
+      middlewares: { use: vi.fn() },
+    }
+    await plugin.configureServer(mockServer)
+    expect(writeGeneratedDir).toHaveBeenCalledTimes(1)
+  })
+
   it('calls scanComposableExports on server configure', async () => {
     const { scanComposableExports } = await import('../../plugin/dts-generator.js')
     vi.mocked(scanComposableExports).mockClear()

package/src/__tests__/plugin/dev-server.test.ts

@@ -48,7 +48,7 @@ function makeConfig(overrides: Partial<ResolvedCerConfig> = {}): ResolvedCerConf
     serverApiDir: '/project/server/api',
     serverMiddlewareDir: '/project/server/middleware',
     port: 3000,
-    ssr: { dsd: true, streaming: false },
+    ssr: { dsd: true },
     ssg: { routes: 'auto', concurrency: 2, fallback: false },
     router: {},
     jitCss: { content: [], extendedColors: false },

package/src/__tests__/plugin/dts-generator.test.ts

@@ -6,10 +6,12 @@ vi.mock('node:fs', async (importOriginal) => {
     ...actual,
     existsSync: vi.fn().mockReturnValue(false),
     writeFileSync: vi.fn(),
+    mkdirSync: vi.fn(),
     readFileSync: vi.fn().mockReturnValue(''),
   }
 })
 vi.mock('../../plugin/scanner.js', () => ({ scanDirectory: vi.fn().mockResolvedValue([]) }))
+vi.mock('../../plugin/generated-dir.js', () => ({ GENERATED_DIR_NAME: '.cer' }))
 
 import { existsSync, writeFileSync, readFileSync } from 'node:fs'
 import { scanDirectory } from '../../plugin/scanner.js'
@@ -32,10 +34,10 @@ beforeEach(() => {
 })
 
 describe('writeTsconfigPaths', () => {
-  it('writes cer-tsconfig.json to the root directory', () => {
+  it('writes tsconfig.json to the .cer directory', () => {
     writeTsconfigPaths(ROOT, `${ROOT}/app`)
     expect(writeFileSync).toHaveBeenCalledWith(
-      `${ROOT}/cer-tsconfig.json`,
+      `${ROOT}/.cer/tsconfig.json`,
       expect.any(String),
       'utf-8',
     )
@@ -65,6 +67,13 @@ describe('writeTsconfigPaths', () => {
     const json = JSON.parse(content)
     expect(json).toHaveProperty('compilerOptions.paths')
   })
+
+  it('includes project source directories in include array', () => {
+    writeTsconfigPaths(ROOT, `${ROOT}/app`)
+    const content = vi.mocked(writeFileSync).mock.calls[0][1] as string
+    const json = JSON.parse(content) as { include?: string[] }
+    expect(Array.isArray(json.include)).toBe(true)
+  })
 })
 
 describe('scanComposableExports', () => {
@@ -227,16 +236,16 @@ describe('generateVirtualModuleDts', () => {
 })
 
 describe('writeAutoImportDts', () => {
-  it('writes cer-auto-imports.d.ts to root', async () => {
+  it('writes auto-imports.d.ts to .cer/', async () => {
     await writeAutoImportDts(ROOT, COMPOSABLES_DIR)
     const paths = vi.mocked(writeFileSync).mock.calls.map(([p]) => String(p))
-    expect(paths.some(p => p.includes('cer-auto-imports.d.ts'))).toBe(true)
+    expect(paths.some(p => p.includes('.cer/auto-imports.d.ts'))).toBe(true)
   })
 
-  it('writes cer-env.d.ts to root', async () => {
+  it('writes env.d.ts to .cer/', async () => {
     await writeAutoImportDts(ROOT, COMPOSABLES_DIR)
     const paths = vi.mocked(writeFileSync).mock.calls.map(([p]) => String(p))
-    expect(paths.some(p => p.includes('cer-env.d.ts'))).toBe(true)
+    expect(paths.some(p => p.includes('.cer/env.d.ts'))).toBe(true)
   })
 
   it('writes exactly two files', async () => {