@jasonshimmy/vite-plugin-cer-app 0.1.0

package/src/runtime/entry-server-template.ts

@@ -0,0 +1,71 @@
+/**
+ * Template string for `entry-server.ts`.
+ *
+ * This is the Node.js SSR entry point. It imports all virtual modules,
+ * wires up the routing, and exports a handler compatible with
+ * Express/Fastify/Node http.
+ */
+export const ENTRY_SERVER_TEMPLATE = `// Server-side entry — AUTO-GENERATED by vite-plugin-cer-app
+import 'virtual:cer-components'
+import routes from 'virtual:cer-routes'
+import layouts from 'virtual:cer-layouts'
+import plugins from 'virtual:cer-plugins'
+import apiRoutes from 'virtual:cer-server-api'
+import { html, registerBuiltinComponents } from '@jasonshimmy/custom-elements-runtime'
+import { initRouter } from '@jasonshimmy/custom-elements-runtime/router'
+import { createStreamingSSRHandler } from '@jasonshimmy/custom-elements-runtime/ssr-middleware'
+
+registerBuiltinComponents()
+
+/**
+ * Per-request VNode factory — initializes a fresh router at the request URL,
+ * resolves the active layout from the matched route's meta, calls the matched
+ * route's data loader (if any), and injects the serialized result into the
+ * document head as window.__CER_DATA__ for client-side hydration.
+ *
+ * createStreamingSSRHandler threads the router through each component's SSR
+ * context so router-view reads from the per-request instance instead of the
+ * shared activeRouterProxy singleton. This makes concurrent SSR requests safe.
+ */
+const vnodeFactory = async (req) => {
+  const router = initRouter({ routes, initialUrl: req.url ?? '/' })
+  const current = router.getCurrent()
+  const { route, params } = router.matchRoute(current.path)
+  const layoutName = route?.meta?.layout ?? 'default'
+  const layoutTag = layouts[layoutName]
+  const inner = html\`<router-view></router-view>\`
+  const vnode = layoutTag
+    ? { tag: layoutTag, props: {}, children: [inner] }
+    : inner
+
+  // Call the route's data loader (if present) and serialize for client hydration.
+  let head
+  if (route?.load) {
+    try {
+      const mod = await route.load()
+      if (typeof mod.loader === 'function') {
+        const query = current.query ?? {}
+        const data = await mod.loader({ params, query, req })
+        if (data !== undefined && data !== null) {
+          head = \`<script>window.__CER_DATA__ = \${JSON.stringify(data)}</script>\`
+        }
+      }
+    } catch {
+      // Loader errors are non-fatal during SSR; the client will refetch.
+    }
+  }
+
+  return { vnode, router, head }
+}
+
+/**
+ * The main request handler.
+ * Compatible with Express, Fastify, and Node's raw http.createServer.
+ */
+export const handler = createStreamingSSRHandler(vnodeFactory, {
+  render: { dsd: true },
+})
+
+export { apiRoutes, plugins, layouts, routes }
+export default handler
+`

package/src/types/api.ts

@@ -0,0 +1,19 @@
+import type { IncomingMessage, ServerResponse } from 'node:http'
+
+export interface ApiRequest extends IncomingMessage {
+  params: Record<string, string>
+  query: Record<string, string>
+  body: unknown
+}
+
+export interface ApiResponse extends ServerResponse {
+  json(data: unknown): void
+  status(code: number): ApiResponse
+}
+
+export type ApiHandler = (req: ApiRequest, res: ApiResponse) => Promise<void> | void
+
+export interface ApiContext {
+  req: ApiRequest
+  res: ApiResponse
+}

package/src/types/config.ts

@@ -0,0 +1,39 @@
+import type { RouterConfig } from '@jasonshimmy/custom-elements-runtime/router'
+
+export interface SsgConfig {
+  routes?: 'auto' | string[]
+  concurrency?: number
+  fallback?: boolean // fall back to SSR for unenumerated routes
+}
+
+export interface JitCssConfig {
+  content?: string[]
+  extendedColors?: boolean
+}
+
+export interface SsrConfig {
+  dsd?: boolean
+  streaming?: boolean
+}
+
+export interface AutoImportsConfig {
+  components?: boolean
+  composables?: boolean
+  directives?: boolean
+  runtime?: boolean
+}
+
+export interface CerAppConfig {
+  mode?: 'spa' | 'ssr' | 'ssg'
+  srcDir?: string // defaults to 'app'
+  ssg?: SsgConfig
+  router?: Pick<RouterConfig, 'base' | 'scrollToFragment'>
+  jitCss?: JitCssConfig
+  ssr?: SsrConfig
+  autoImports?: AutoImportsConfig
+  port?: number
+}
+
+export function defineConfig(config: CerAppConfig): CerAppConfig {
+  return config
+}

package/src/types/index.ts

@@ -0,0 +1,6 @@
+export type { CerAppConfig, SsgConfig, JitCssConfig, SsrConfig, AutoImportsConfig } from './config.js'
+export { defineConfig } from './config.js'
+export type { HydrateStrategy, SsgPathsContext, PageSsgConfig, PageMeta, PageLoaderContext, PageLoader } from './page.js'
+export type { ApiRequest, ApiResponse, ApiHandler, ApiContext } from './api.js'
+export type { AppContext, AppPlugin } from './plugin.js'
+export type { NextFunction, RouteMiddleware, ServerMiddleware } from './middleware.js'

package/src/types/middleware.ts

@@ -0,0 +1,16 @@
+import type { RouteState } from '@jasonshimmy/custom-elements-runtime/router'
+import type { IncomingMessage, ServerResponse } from 'node:http'
+
+export type NextFunction = (redirectTo?: string) => void
+
+export type RouteMiddleware = (
+  to: RouteState,
+  from: RouteState | null,
+  next: NextFunction,
+) => void | Promise<void>
+
+export type ServerMiddleware = (
+  req: IncomingMessage,
+  res: ServerResponse,
+  next: () => void,
+) => void | Promise<void>

package/src/types/page.ts

@@ -0,0 +1,29 @@
+import type { IncomingMessage } from 'node:http'
+
+export type HydrateStrategy = 'load' | 'idle' | 'visible' | 'none'
+
+export interface SsgPathsContext {
+  params: Record<string, string>
+}
+
+export interface PageSsgConfig {
+  paths?: () => Promise<SsgPathsContext[]> | SsgPathsContext[]
+}
+
+export interface PageMeta {
+  layout?: string // name of layout in app/layouts/ (default: 'default')
+  middleware?: string[] // named middleware files from app/middleware/
+  hydrate?: HydrateStrategy
+  ssg?: PageSsgConfig
+}
+
+export interface PageLoaderContext<P extends Record<string, string> = Record<string, string>> {
+  params: P
+  query: Record<string, string>
+  req: IncomingMessage
+}
+
+export type PageLoader<
+  P extends Record<string, string> = Record<string, string>,
+  D = Record<string, unknown>,
+> = (ctx: PageLoaderContext<P>) => Promise<D> | D

package/src/types/plugin.ts

@@ -0,0 +1,13 @@
+import type { Router } from '@jasonshimmy/custom-elements-runtime/router'
+import type { CerAppConfig } from './config.js'
+
+export interface AppContext {
+  provide(key: PropertyKey, value: unknown): void
+  router: Router
+  config: CerAppConfig
+}
+
+export interface AppPlugin {
+  name: string
+  setup(app: AppContext): void | Promise<void>
+}

package/tsconfig.build.json

@@ -0,0 +1,10 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "declaration": true,
+    "declarationMap": true,
+    "outDir": "dist",
+    "rootDir": "src"
+  },
+  "exclude": ["node_modules", "dist", "src/cli/create/templates"]
+}

package/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "lib": ["ES2022", "DOM"],
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "resolveJsonModule": true,
+    "declaration": true,
+    "declarationMap": true,
+    "sourceMap": true,
+    "outDir": "dist",
+    "rootDir": "src"
+  },
+  "include": ["src/**/*.ts"],
+  "exclude": ["node_modules", "dist", "src/cli/create/templates"]
+}

package/vitest.config.ts

@@ -0,0 +1,29 @@
+import { defineConfig } from 'vitest/config'
+
+export default defineConfig({
+  test: {
+    environment: 'node',
+    environmentOptions: {
+      happyDom: {
+        // Prevent happy-dom from attempting to fetch external script files
+        settings: {
+          disableJavaScriptFileLoading: true,
+          disableJavaScriptEvaluation: true,
+          disableComputedStyleRendering: true,
+        },
+      },
+    },
+    coverage: {
+      provider: 'v8',
+      reporter: ['text', 'lcov'],
+      include: ['src/**/*.ts'],
+      exclude: [
+        'src/cli/**',
+        'src/runtime/app-template.ts',
+        'src/runtime/entry-client-template.ts',
+        'src/runtime/entry-server-template.ts',
+        'src/__tests__/**',
+      ],
+    },
+  },
+})