hono-svelte

API reference

v0.0.1 โ€” minimal surface. Three exports. That's the API.

svelteRenderer(component, options)

Returns a Hono MiddlewareHandler that responds with an HTML document containing the SSR'd Svelte component, followed by a hydration script that mounts the matching client bundle.

OptionTypeRequiredNotes
hydrateAsstringyesMatches a key in the bundles map passed to attachSvelteRoutes.
propsRecord<string, unknown>noSame props used by SSR and hydration. JSON-serialized into the page.
titlestringnoSets <title>.
headstringnoExtra raw <head> HTML.
bodyClassstringnoClass on the <body>.

attachSvelteRoutes(app, options)

Registers GET /__svelte/:id.{js,css} routes on the Hono app. Call once per app instance. Idempotent.

OptionTypeNotes
bundlesRecord<string, { js, css }>Keyed by hydrateAs. The build helper produces this.
prefixstringDefaults to "/__svelte". Override only on collision.

buildHonoSvelte(options)

From hono-svelte/build. Two esbuild passes โ€” client + server โ€” emitting a single bundled worker with all client bundles inlined as build-time string constants.

OptionTypeNotes
workerEntrystringPath to your Worker entry (TS or JS).
outDirstringOutput dir. worker.bundled.mjs lands here.
componentsRecord<string, string>id โ†’ path to .svelte file. id matches hydrateAs.
targetstringDefaults "es2022".
devbooleanSource maps + no minify. Defaults false.

The constant the build injects

Inside your worker source:

declare const __HONO_SVELTE_BUNDLES__: Record<string, { js: string; css: string }>;

esbuild's define replaces this identifier with a JSON object at build time. Pass it directly to attachSvelteRoutes.

Constraints