fix: production build — convert require() to await import() in caching/runtime-injection

- getCachedSignalsRuntime and getCachedRouterScript now async (await import)
- injectSignalsRuntime and injectRouterScript now async
- All callers updated to await: signal-processing, serve-app, plugin, render
- Fix layout file routing — exclude layouts/, components/, partials/ from page discovery
- Tested: training app production build — 17 pages, 0 errors, 142ms

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

Author: glennmichael123

packages/bun-plugin/src/serve.ts

@@ -89,10 +89,18 @@ export async function serve(options: ServeOptions): Promise<void> {
         const stat = await fs.stat(pattern).catch(() => null)
 
         if (stat?.isDirectory()) {
+          // Directories to exclude from page routing — these contain non-page .stx files
+          const excludeDirs = ['layouts', 'components', 'partials']
+          if (layoutsDir) excludeDirs.push(layoutsDir.replace(/^.*\//, ''))
+          if (componentsDir) excludeDirs.push(componentsDir.replace(/^.*\//, ''))
+          if (partialsDir) excludeDirs.push(partialsDir.replace(/^.*\//, ''))
+
           for (const ext of ['.stx', '.md', '.html']) {
             const glob = new Glob(`**/*${ext}`)
             const discovered = await Array.fromAsync(glob.scan({ cwd: pattern, followSymlinks: true }))
-            files.push(...discovered.map(f => `${pattern}/${f}`.replace(/\/+/g, '/')))
+            files.push(...discovered
+              .filter(f => !excludeDirs.some(dir => f.startsWith(dir + '/')))
+              .map(f => `${pattern}/${f}`.replace(/\/+/g, '/')))
           }
         }
         else if (pattern.includes('*')) {

packages/stx/src/caching.ts

@@ -80,14 +80,14 @@ let _cachedSignalsRuntimeDev: string | null = null
  * Get the signals runtime with module-level caching.
  * The runtime is identical for every page and never changes during a dev session.
  */
-export function getCachedSignalsRuntime(debug = false): string {
+export async function getCachedSignalsRuntime(debug = false): Promise<string> {
   if (debug) {
     // In debug mode, always regenerate to avoid stale runtime issues
-    const { generateSignalsRuntimeDev } = require('./signals')
+    const { generateSignalsRuntimeDev } = await import('./signals')
     return generateSignalsRuntimeDev()
   }
   if (_cachedSignalsRuntime === null) {
-    const { generateSignalsRuntime } = require('./signals')
+    const { generateSignalsRuntime } = await import('./signals')
     _cachedSignalsRuntime = generateSignalsRuntime()
   }
   return _cachedSignalsRuntime!
@@ -101,9 +101,9 @@ let _cachedRouterScript: string | null = null
 /**
  * Get the router script with module-level caching.
  */
-export function getCachedRouterScript(): string {
+export async function getCachedRouterScript(): Promise<string> {
   if (_cachedRouterScript === null) {
-    const { getRouterScript } = require('stx-router')
+    const { getRouterScript } = await import('stx-router')
     _cachedRouterScript = getRouterScript()
   }
   return _cachedRouterScript!

packages/stx/src/dev-server/serve-app.ts

@@ -312,7 +312,7 @@ export async function serveApp(appDir: string = '.', options: DevServerOptions =
 
       // Inject SPA router (skip when using shell — router goes in shell composition)
       if (!shell) {
-        output = injectRouterScript(output)
+        output = await injectRouterScript(output)
       }
 
       // Re-inject client scripts before </body>

packages/stx/src/plugin.ts

@@ -181,7 +181,7 @@ export const plugin: BunPlugin = {
         }
 
         // Inject SPA router for full-page templates (has </body> guard built in)
-        output = injectRouterScript(output)
+        output = await injectRouterScript(output)
 
         // Track dependencies for this file
         dependencies.forEach(dep => allDependencies.add(dep))

packages/stx/src/render.ts

@@ -349,7 +349,7 @@ async function renderTemplateString(
   }
 
   // Inject SPA router script for client-side navigation
-  output = injectRouterScript(output)
+  output = await injectRouterScript(output)
 
   // Optionally inject Crosswind CSS from Tailwind utility classes
   if (renderOptions.injectCSS) {

packages/stx/src/runtime-injection.ts

@@ -106,7 +106,7 @@ import '@stacksjs/browser'
  * Inject STX signals runtime into the template.
  * The runtime provides client-side reactivity.
  */
-export function injectSignalsRuntime(template: string, options: StxOptions): string {
+export async function injectSignalsRuntime(template: string, options: StxOptions): Promise<string> {
   // Don't inject if actual signals runtime is already present
   // Check for the runtime's unique signature (state, derived, effect assignment),
   // not just any 'window.stx =' which could be scope registration from includes
@@ -130,8 +130,8 @@ export function injectSignalsRuntime(template: string, options: StxOptions): str
   }
 
   // Use cached runtime (identical for every page, never changes during dev session)
-  const { getCachedSignalsRuntime } = require('./caching')
-  const runtime = getCachedSignalsRuntime(options.debug)
+  const { getCachedSignalsRuntime } = await import('./caching')
+  const runtime = await getCachedSignalsRuntime(options.debug)
   const runtimeScript = `<script data-stx-scoped>${runtime}</script>`
 
   // Inject before the first <script in the ENTIRE document, not just <head>.
@@ -163,7 +163,7 @@ export function injectSignalsRuntime(template: string, options: StxOptions): str
  * The router is provided by the canonical router in packages/router/src/client.ts.
  * It guards against double-initialization so it's safe to inject alongside @stxRouter.
  */
-export function injectRouterScript(template: string, options?: StxOptions): string {
+export async function injectRouterScript(template: string, options?: StxOptions): Promise<string> {
   // Only inject into full HTML pages (not template fragments or components)
   if (!template.includes('</body>')) {
     return template
@@ -190,10 +190,10 @@ export function injectRouterScript(template: string, options?: StxOptions): stri
   }
 
   // Build mode: emit a placeholder reference instead of inlining the full router script.
-  const { getCachedRouterScript } = require('./caching')
+  const { getCachedRouterScript } = await import('./caching')
   const routerScript = options?.buildMode === 'compile'
     ? `<script src="/__stx/router.__STX_HASH__.js"></script>`
-    : `<script>${getCachedRouterScript()}</script>`
+    : `<script>${await getCachedRouterScript()}</script>`
 
   // Use string concatenation to avoid $-interpretation in .replace()
   const bodyCloseIdx = template.lastIndexOf('</body>')

packages/stx/src/signal-processing.ts

@@ -535,7 +535,7 @@ export async function processSignals(template: string, options: StxOptions, file
   output = processedOutput
 
   // Inject the signals runtime
-  output = injectSignalsRuntime(output, options)
+  output = await injectSignalsRuntime(output, options)
 
   // Inject browser runtime if needed (for auto-imports from @stacksjs/browser)
   output = injectBrowserRuntime(output)