evolit 0.1.0-alpha.3 → 0.1.0-alpha.30

package/README.md

@@ -76,6 +76,98 @@ The current runtime is split into a few small layers:
 - `src/scaffold.js`: creates new site projects from templates
 - `src/cli.js`: framework entrypoint
 
+## Client Navigation
+
+Evolit hydrates a small browser router automatically for SSR page documents. It requests a route
+delta, replaces only the changed route segment, and keeps parent layouts mounted when possible.
+Plain `<a>` elements remain valid SSR HTML; same-origin links are progressively intercepted after
+hydration.
+
+Use `useNavigation()` inside a LitSX browser component for imperative navigation and pending UI:
+
+```jsx
+import { useNavigation } from "evolit/navigation";
+
+export default function CollectionControls() {
+  const navigation = useNavigation();
+
+  function changeSort(event) {
+    const searchParams = new URLSearchParams(window.location.search);
+    searchParams.delete("page");
+    searchParams.delete("skip");
+    searchParams.set("sort", event.target.value);
+    navigation.push(navigation.createHref("/explore/home-garden", searchParams));
+  }
+
+  return <select onChange={changeSort} disabled={navigation.status === "pending"}>…</select>;
+}
+```
+
+The hook returns `{ status, url, pendingUrl, error, push, replace, refresh, createHref }`:
+
+- `push(target, { scroll: false })` adds a browser-history entry. Pass
+  `scroll: false` to keep the current viewport position.
+- `replace(target, { scroll: false })` updates the current entry, useful for
+  visual-only query state. It accepts the same scroll option.
+- `refresh()` bypasses the client delta cache for the current URL.
+- `createHref(pathname, searchParams)` creates a relative internal URL. It accepts standard
+  `URLSearchParams`, preserving repeated keys such as `facet=brand&facet=material`.
+
+`createHref` can also be imported directly from `evolit/navigation`; it is browser-free and safe to
+share with server-evaluated route code. `useNavigation()` itself is browser-only and must only run
+from a connected client component.
+
+Client components can also read the active route state with browser-only hooks:
+
+```jsx
+import { useParams, useSearchParams } from "evolit/navigation";
+
+const { slug = [] } = useParams();
+const searchParams = useSearchParams();
+const selectedFacets = searchParams.getAll("facet");
+```
+
+Both hooks update after client navigation. `useParams()` returns a read-only snapshot; the
+`URLSearchParams` from `useSearchParams()` is a local snapshot, so build a new href and navigate to
+it to update the URL.
+
+### Development refresh
+
+In development, each browser subscribes its active URL over the Evolit WebSocket. After source
+invalidation, the server renders the fresh SSR representation once per request context and pushes
+the resulting delta directly to its subscribers. No follow-up browser request is needed. Server-only
+module and static-asset changes update only the affected route segment while preserving the document,
+scroll position, and persistent layouts.
+Changes to a hydrated client boundary rebuild its browser artifact and update the stable Evolit
+development proxy registered for that tag. Existing instances receive the new implementation
+without redefining the Custom Element or replacing the document. Invalid deltas and failed hot
+updates still fall back to a document reload.
+
+### Progressive links and forms
+
+Links work without JavaScript. With JavaScript, Evolit intercepts ordinary same-origin left-clicks.
+Set `data-evolit-navigation="false"` on a link to keep native navigation.
+
+Internal `<form method="get">` elements are treated the same way: their successful controls become
+`URLSearchParams` and navigate through a delta. Without JavaScript the browser submits the exact
+same GET form normally. Evolit intentionally does not intercept `POST`, file-upload, external,
+targeted, or opted-out forms.
+
+### Navigation cache and document updates
+
+The browser cache is scoped to browser-history entries, not a global URL map. Going back or forward
+can reuse the delta for that exact entry; opening a new branch after going back discards its known
+forward branch. This avoids an unbounded catalog cache in a long-lived tab.
+
+- `dynamic` routes are never cached in the browser.
+- `revalidate` entries remain reusable only until their route TTL expires.
+- `static` entries remain reusable while their history entry exists in the current tab session.
+
+Each delta also synchronizes route `<title>`, route-specific `<head>` markup, managed styles and
+module preloads, `html`/`body` attributes, scroll position, hash targets, and focus. If a response
+cannot be represented as an Evolit delta —for example a 404 from another adapter— navigation falls
+back to a normal document load.
+
 ## Route Cache Policies
 
 Route modules can export a `routeConfig` object with a `cache` policy:
@@ -104,12 +196,18 @@ export const routeConfig = {
 - `static`: prerender in `build` and serve from the response cache in `start`
 - `revalidate`: cache the HTML response for `N` seconds and regenerate on expiry
 
+Pages without `routeConfig.cache` default to `{ revalidate: 60 }`. This caches a normal SSR
+render by pathname and query string while keeping content fresh without requiring a cache
+declaration on every catalog or CMS page. Declare `cache: "static"` for fully static pages or
+`cache: "dynamic"` when a page must always render per request.
+
 The same semantics work in local development and in production runtimes. Only the backing cache
 store changes.
 
-The default cache key includes the pathname and query string. Reading the `request` prop, request
-headers, cookies, or `requestUrl()` makes the completed render dynamic; it is never stored in the
-HTML response cache. `routeConfig.cache` is the sole authority for HTML caching; setting a
+The default cache key includes the pathname and query string, so `params` and `searchParams` are
+cacheable by URL. Reading the `request` prop, request headers, cookies, or `requestUrl()` makes
+the completed render dynamic; it is never stored in the HTML response cache. `routeConfig.cache`
+is the sole authority for HTML caching; setting a
 `Cache-Control` response header does not alter that policy.
 
 ## Request APIs
@@ -231,6 +329,33 @@ export default {
 };
 ```
 
+For monorepos, development watches only the application project by default. Additional source
+trees can be opted into explicitly; generated output and dependency directories below every root
+remain ignored:
+
+```js
+export default {
+  development: {
+    managedSourceRoots: ["../packages/design-system/src"],
+  },
+};
+```
+
+Imports outside these roots remain unmanaged and produce the existing development warning.
+
+Evolit normally discovers browser boundaries from the static module graph and reconciles that
+inventory with the components actually emitted by SSR. A genuinely computed import cannot be
+enumerated at build time, so production applications can declare only those exceptional modules:
+
+```js
+export default {
+  clientBoundaries: ["./src/components/dynamic-card.litsx", "@acme/ui/product-card"],
+};
+```
+
+These modules are materialized as build artifacts, but are not automatically imported or
+preloaded. They reach the browser only when an SSR hydration root references them.
+
 The framework also exports `ObjectStorageResponseCacheStore`, which is intended for object-store
 backends such as S3. A concrete app can wire it to the AWS SDK without pulling AWS dependencies
 into `evolit` itself.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "evolit",
-  "version": "0.1.0-alpha.3",
+  "version": "0.1.0-alpha.30",
   "description": "A convention-driven application framework for LitSX and web components.",
   "type": "module",
   "packageManager": "yarn@4.10.3",
@@ -14,22 +14,30 @@
   "homepage": "https://github.com/litsxdev/nextsx#readme",
   "files": [
     "src",
-    "templates"
+    "templates/default/app/**",
+    "templates/default/jsconfig.json",
+    "templates/default/yarnrc.yml.template"
   ],
   "bin": "./src/cli.js",
   "main": "./src/index.js",
   "exports": {
     ".": "./src/index.js",
+    "./navigation": {
+      "browser": "./src/navigation-client.js",
+      "default": "./src/navigation-server.js"
+    },
     "./server": {
       "browser": "./src/request-context-browser.js",
       "default": "./src/server-api.js"
-    }
+    },
+    "./internal/development-hot": "./src/development-hot-client.js"
   },
   "scripts": {
     "dev": "node ./src/cli.js dev",
     "build": "node ./src/cli.js build",
     "start": "node ./src/cli.js start",
-    "test": "node --test",
+    "test": "node --test test/*.test.js",
+    "test:browser": "playwright test",
     "typecheck": "litsx-tsc -p jsconfig.json --noEmit",
     "release:check": "yarn test && yarn typecheck && yarn pack --dry-run"
   },
@@ -47,17 +55,29 @@
   },
   "dependencies": {
     "@jridgewell/remapping": "^2.3.5",
-    "@litsx/compiler": "0.9.5-canary-feat-ssr-20260726130435",
-    "@litsx/core": "0.17.0-canary-feat-ssr-20260726130435",
-    "@litsx/ssr": "0.2.0-canary-feat-ssr-20260726130435",
+    "@litsx/compiler": "0.10.0-canary-feat-ssr-20260801095541",
+    "@litsx/core": "0.17.0-canary-feat-ssr-20260801101748",
+    "@litsx/ssr": "0.2.0-canary-feat-ssr-20260801095541",
     "@litsx/typescript": "^0.9.0",
+    "@rollup/plugin-commonjs": "^29.0.0",
     "@rollup/plugin-node-resolve": "^16.0.3",
     "lit": "^3.3.3",
     "magic-string": "^1.1.0",
     "rollup": "^4.46.1",
-    "typescript": "^6.0.0"
+    "typescript": "^6.0.0",
+    "ws": "^8.18.3"
+  },
+  "peerDependencies": {
+    "@litsx/urql": "^0.3.0"
+  },
+  "peerDependenciesMeta": {
+    "@litsx/urql": {
+      "optional": true
+    }
   },
   "devDependencies": {
+    "@playwright/test": "^1.62.0",
+    "@webcomponents/scoped-custom-element-registry": "^0.0.10",
     "vite": "^8.1.5"
   }
 }

package/src/build.js

@@ -1,5 +1,6 @@
 import fs from "node:fs/promises";
 import path from "node:path";
+import { fileURLToPath } from "node:url";
 import {
   discoverAppRouteHandlers,
   discoverAppRoutes,
@@ -15,11 +16,20 @@ import {
   emitBundledClientAssets,
   emitHashedClientAssets,
   normalizeHydrationDataForClient,
+  resolveServerStyleUrls,
+  resolveHydrationRootClientImports,
   resolveSharedVendorModuleUrl,
   rewriteHydrationDataScript,
   rewriteServerAssetPlaceholders,
 } from "./client-assets.js";
-import { compileModuleGraph, importCompiledModule } from "./compiler.js";
+import {
+  collectClientGraphInventory,
+  compileModuleGraph,
+  emitClientStaticAssets,
+  getClientStaticAssetModule,
+  importCompiledModule,
+  resolveProjectModuleSpecifier,
+} from "./compiler.js";
 import { loadEvolitConfig } from "./config.js";
 import {
   BUILD_DIRECTORY,
@@ -38,6 +48,7 @@ import {
 import { serializeRouteCachePolicy } from "./route-config.js";
 import { createSsrAdapter, renderRouteTreeWithAdapter } from "./ssr-adapter.js";
 import { ensureDirectory, writeJson } from "./fs-utils.js";
+import { appendSsrUrqlData, runWithOptionalSsrUrqlScope } from "./urql-ssr.js";
 
 const CONTENT_TYPE_BY_EXTENSION = new Map([
   [".css", "text/css; charset=utf-8"],
@@ -122,7 +133,37 @@ export async function buildProject(projectRoot) {
   const routeHandlers = await discoverAppRouteHandlers(projectRoot);
   const buildRoot = path.join(projectRoot, INTERNAL_DIRECTORY, BUILD_DIRECTORY);
   const entryClientModules = new Set();
+  const serverAssetImportsByEntry = {};
+  const clientBoundariesByEntry = {};
   const deployHandlers = [];
+  const compiledClientBoundaries = new Map();
+  const inventoriesBySourceEntry = new Map();
+
+  function getEntryInventory(entryPath) {
+    let inventory = inventoriesBySourceEntry.get(entryPath);
+    if (!inventory) {
+      inventory = collectClientGraphInventory([entryPath], { projectRoot });
+      inventoriesBySourceEntry.set(entryPath, inventory);
+    }
+    return inventory;
+  }
+
+  async function compileProductionClientBoundary(sourcePath) {
+    let clientModule = compiledClientBoundaries.get(sourcePath);
+    if (clientModule) return clientModule;
+    const clientBuild = await compileModuleGraph(sourcePath, {
+      projectRoot,
+      mode: "production",
+      sourceMaps: true,
+      target: "client",
+    });
+    clientModule = path.relative(clientBuild.outputRoot, clientBuild.entrypoint)
+      .split(path.sep)
+      .join("/");
+    compiledClientBoundaries.set(sourcePath, clientModule);
+    entryClientModules.add(clientModule);
+    return clientModule;
+  }
 
   await ensureDirectory(buildRoot);
 
@@ -165,16 +206,6 @@ export async function buildProject(projectRoot) {
       target: "server",
     });
 
-    const pageClientBuild = await compileModuleGraph(route.page, {
-      projectRoot,
-      mode: "production",
-      sourceMaps: true,
-      target: "client",
-    });
-    entryClientModules.add(
-      path.relative(pageClientBuild.outputRoot, pageClientBuild.entrypoint).split(path.sep).join("/"),
-    );
-
     for (const layoutPath of route.layouts) {
       await compileModuleGraph(layoutPath, {
         projectRoot,
@@ -184,15 +215,6 @@ export async function buildProject(projectRoot) {
         target: "server",
       });
 
-      const layoutClientBuild = await compileModuleGraph(layoutPath, {
-        projectRoot,
-        mode: "production",
-        sourceMaps: true,
-        target: "client",
-      });
-      entryClientModules.add(
-        path.relative(layoutClientBuild.outputRoot, layoutClientBuild.entrypoint).split(path.sep).join("/"),
-      );
     }
 
     const boundaryModules = [
@@ -207,23 +229,70 @@ export async function buildProject(projectRoot) {
         ssr: true,
         target: "server",
       });
+    }
 
-      const boundaryClientBuild = await compileModuleGraph(boundaryPath, {
+    const toProjectRelative = (filePath) => path.relative(projectRoot, filePath).split(path.sep).join("/");
+    const segmentEntries = [...new Set([route.page, ...route.layouts, ...boundaryModules])];
+    const inventoriesByEntry = new Map(await Promise.all(segmentEntries.map(async (entryPath) => [
+      entryPath,
+      await getEntryInventory(entryPath),
+    ])));
+    const allStyles = new Set();
+    const allAssets = new Set();
+    const allClientBoundaries = new Set();
+    for (const [entryPath, entryInventory] of inventoriesByEntry) {
+      serverAssetImportsByEntry[toProjectRelative(entryPath)] = {
+        styles: entryInventory.styles.map((filePath) => getClientStaticAssetModule(projectRoot, filePath)),
+        assets: entryInventory.assets.map((filePath) => getClientStaticAssetModule(projectRoot, filePath)),
+      };
+      entryInventory.styles.forEach((filePath) => allStyles.add(filePath));
+      entryInventory.assets.forEach((filePath) => allAssets.add(filePath));
+      entryInventory.clientBoundaries.forEach((filePath) => allClientBoundaries.add(filePath));
+    }
+    await emitClientStaticAssets([...allStyles, ...allAssets], {
+      projectRoot,
+      mode: "production",
+    });
+    const compiledBoundaryModules = new Map();
+    for (const clientBoundary of allClientBoundaries) {
+      compiledBoundaryModules.set(
+        clientBoundary,
+        await compileProductionClientBoundary(clientBoundary),
+      );
+    }
+    for (const [entryPath, entryInventory] of inventoriesByEntry) {
+      clientBoundariesByEntry[toProjectRelative(entryPath)] = entryInventory.clientBoundaries
+        .map((clientBoundary) => compiledBoundaryModules.get(clientBoundary))
+        .filter(Boolean)
+        .sort();
+    }
+  }
+
+  const configuredClientBoundaries = evolitConfig.clientBoundaries ?? [];
+  if (!Array.isArray(configuredClientBoundaries)) {
+    throw new Error("Expected clientBoundaries in evolit.config.js to be an array of module specifiers.");
+  }
+  for (const specifier of configuredClientBoundaries) {
+    if (typeof specifier !== "string" || specifier.length === 0) {
+      throw new Error("Expected every clientBoundaries entry to be a non-empty module specifier.");
+    }
+    const sourcePath = path.isAbsolute(specifier)
+      ? specifier
+      : await resolveProjectModuleSpecifier(
         projectRoot,
-        mode: "production",
-        sourceMaps: true,
-        target: "client",
-      });
-      entryClientModules.add(
-        path.relative(boundaryClientBuild.outputRoot, boundaryClientBuild.entrypoint)
-          .split(path.sep)
-          .join("/"),
+        path.join(projectRoot, "evolit.config.js"),
+        specifier,
       );
+    if (!sourcePath) {
+      throw new Error(`Unable to resolve configured client boundary ${JSON.stringify(specifier)}.`);
     }
+    await compileProductionClientBoundary(sourcePath);
   }
 
   const clientAssets = await emitBundledClientAssets(projectRoot, {
     entryClientModules,
+    serverAssetImportsByEntry,
+    clientBoundariesByEntry,
   });
   const staticAssetPublicUrls = createStaticAssetPublicUrlMap(clientAssets);
   await rewriteServerAssetPlaceholders(projectRoot, clientAssets);
@@ -241,27 +310,93 @@ export async function buildProject(projectRoot) {
   );
   const ssrAdapter = createSsrAdapter({
     assetResolver,
-    async resolveAdditionalHead({ result }) {
-      const clientImports = Array.isArray(result.clientImports) ? result.clientImports : [];
-      const urls = collectTransitiveAssetPreloads(clientImports, clientAssets);
-      const styleUrls = collectTransitiveStyleUrls(clientImports, clientAssets);
+    async onSsrResult({ routeResult, result }) {
+      const renderedModules = [...new Set([
+        ...(Array.isArray(result.clientImports) ? result.clientImports : []),
+        ...(Array.isArray(result.hydrationData?.roots)
+          ? result.hydrationData.roots.map((root) => root?.moduleId)
+          : []),
+      ].filter((moduleId) => typeof moduleId === "string" && moduleId.length > 0))];
+      const unresolved = [];
+      for (const moduleId of renderedModules) {
+        if (assetResolver(moduleId) || clientAssets.byPublicPath?.[moduleId]) continue;
+        const importerPath = routeResult.boundaryModule
+          ?? routeResult.route?.page
+          ?? path.join(projectRoot, "app", "page.litsx");
+        let sourcePath = null;
+        if (moduleId.startsWith("file:")) {
+          try { sourcePath = fileURLToPath(moduleId); } catch {}
+        } else if (path.isAbsolute(moduleId) && !moduleId.startsWith("/app/") && !moduleId.startsWith("/src/")) {
+          sourcePath = moduleId;
+        } else if (moduleId.startsWith("/")) {
+          sourcePath = await resolveProjectModuleSpecifier(projectRoot, importerPath, `.${moduleId}`);
+        } else {
+          sourcePath = await resolveProjectModuleSpecifier(projectRoot, importerPath, moduleId);
+        }
+        const publicUrl = sourcePath ? assetResolver(sourcePath) : null;
+        if (!publicUrl) {
+          unresolved.push(moduleId);
+          continue;
+        }
+        for (const root of result.hydrationData?.roots ?? []) {
+          if (root?.moduleId === moduleId) root.moduleId = sourcePath;
+        }
+        if (Array.isArray(result.clientImports)) {
+          result.clientImports = result.clientImports.map((value) => value === moduleId ? publicUrl : value);
+        }
+        if (Array.isArray(result.hydrationData?.clientImports)) {
+          result.hydrationData.clientImports = result.hydrationData.clientImports
+            .map((value) => value === moduleId ? publicUrl : value);
+        }
+      }
+      if (unresolved.length > 0) {
+        throw new Error(
+          `SSR rendered client boundaries without build artifacts for ${routeResult.route?.pathname ?? "route"}: `
+          + `${unresolved.join(", ")}.`,
+        );
+      }
+    },
+    async resolveAdditionalHead({ routeResult, result }) {
+      const clientImports = [...new Set([
+        ...(Array.isArray(result.clientImports) ? result.clientImports : []),
+        ...resolveHydrationRootClientImports(result.hydrationData, assetResolver),
+      ])];
+      const hydratedClientImports = clientImports;
+      const urls = hydratedClientImports.length > 0
+        ? [...new Set([
+          ...hydratedClientImports,
+          ...collectTransitiveAssetPreloads(hydratedClientImports, clientAssets),
+        ])]
+        : [];
+      const styleUrls = [...new Set([
+        ...collectTransitiveStyleUrls(clientImports, clientAssets),
+        ...resolveServerStyleUrls(routeResult, projectRoot, clientAssets),
+      ])];
 
       return [
-        ...urls.map((href) => `<link rel="modulepreload" href="${href}">`),
-        ...styleUrls.map((href) => `<link rel="stylesheet" href="${href}">`),
+        ...urls.map((href) => `<link rel="modulepreload" href="${href}" data-evolit-route-asset="preload">`),
+        ...styleUrls.map((href) => `<link rel="stylesheet" href="${href}" data-evolit-route-asset="style">`),
       ].join("\n");
     },
-    resolveBootstrap({ result }) {
+    resolveBootstrap({ routeResult, result }) {
       return createHydrationBootstrap({
-        hydrationData: normalizeHydrationDataForClient(result.hydrationData, projectRoot),
+        hydrationData: normalizeHydrationDataForClient(
+          result.hydrationData,
+          projectRoot,
+          resolveHydrationRootClientImports(result.hydrationData, assetResolver),
+        ),
         assetResolver,
         hydrationModuleUrl,
       });
     },
-    transformDocument({ result, document }) {
+    transformDocument({ routeResult, result, document }) {
       return rewriteHydrationDataScript(
         document,
-        normalizeHydrationDataForClient(result.hydrationData, projectRoot),
+        normalizeHydrationDataForClient(
+          result.hydrationData,
+          projectRoot,
+          resolveHydrationRootClientImports(result.hydrationData, assetResolver),
+        ),
       );
     },
   });
@@ -309,12 +444,23 @@ export async function buildProject(projectRoot) {
       seenPrerenderTargets.add(targetPathname);
 
       const targetRequest = new Request(`http://evolit.local${targetPathname}`);
-      const routeResult = await routeResolver.resolveRequest(targetRequest);
-      if (routeResult.type !== "route" || routeResult.cachePolicy.mode === "dynamic") {
+      const { routeResult, response } = await runWithOptionalSsrUrqlScope(async (urqlAdapter) => {
+        const resolvedRouteResult = await routeResolver.resolveRequest(targetRequest);
+        if (resolvedRouteResult.type !== "route" || resolvedRouteResult.cachePolicy.mode === "dynamic") {
+          return { routeResult: resolvedRouteResult, response: null };
+        }
+
+        const renderedResponse = await renderRouteTreeWithAdapter(resolvedRouteResult, ssrAdapter);
+        return {
+          routeResult: resolvedRouteResult,
+          response: urqlAdapter
+            ? appendSsrUrqlData(renderedResponse, await urqlAdapter.getUrqlSsrData())
+            : renderedResponse,
+        };
+      });
+      if (!response) {
         continue;
       }
-
-      const response = await renderRouteTreeWithAdapter(routeResult, ssrAdapter);
       if (response.status !== 200) {
         continue;
       }

package/src/cli.js

@@ -3,6 +3,9 @@
 import path from "node:path";
 import process from "node:process";
 import { scaffoldSite } from "./scaffold.js";
+import { createDevelopmentEventReporter } from "./development-events.js";
+
+const reportEvent = createDevelopmentEventReporter();
 
 function parseArguments(argv) {
   const [command, ...rest] = argv;
@@ -24,9 +27,7 @@ function parseArguments(argv) {
 }
 
 function printUsage() {
-  console.log("Usage: evolit <directory>");
-  console.log("       evolit init <directory>");
-  console.log("       evolit <dev|build|start> [--port 3000]");
+  reportEvent({ type: "usage" });
 }
 
 async function createSite(projectRoot, targetDirectory) {
@@ -35,7 +36,7 @@ async function createSite(projectRoot, targetDirectory) {
   }
 
   const createdDirectory = await scaffoldSite(path.resolve(projectRoot, targetDirectory));
-  console.log(`Created evolit site: ${createdDirectory}`);
+  reportEvent({ type: "site-created", directory: createdDirectory });
 }
 
 async function run() {
@@ -55,23 +56,29 @@ async function run() {
   if (command === "build") {
     const { buildProject } = await import("./build.js");
     const manifestPath = await buildProject(projectRoot);
-    console.log(`Built evolit app: ${path.relative(projectRoot, manifestPath)}`);
+    reportEvent({
+      type: "build-ready",
+      manifestPath: path.relative(projectRoot, manifestPath),
+    });
     return;
   }
 
   if (command === "start") {
     const { createStartServer } = await import("./server.js");
+    reportEvent({ type: "server-starting", mode: "start" });
     const server = await createStartServer(projectRoot, options);
     await server.listen();
-    console.log(`evolit start listening on http://localhost:${server.port}`);
+    reportEvent({ type: "server-ready", port: server.port });
     return;
   }
 
   if (command === "dev") {
     const { createDevServer } = await import("./server.js");
-    const server = await createDevServer(projectRoot, options);
+    const server = await createDevServer(projectRoot, {
+      ...options,
+      onDevelopmentEvent: reportEvent,
+    });
     await server.listen();
-    console.log(`evolit dev listening on http://localhost:${server.port}`);
     return;
   }
 
@@ -79,6 +86,6 @@ async function run() {
 }
 
 run().catch((error) => {
-  console.error(error instanceof Error ? error.stack ?? error.message : String(error));
+  reportEvent({ type: "fatal-error", error });
   process.exitCode = 1;
 });