v0.2.0
hono-preact v0.2.0
Multi-cloud deployment, a unified middleware primitive, and create-hono-preact for new projects.
Highlights
- Multi-cloud adapters.
honoPreact()now takes a requiredadapteroption. The framework shipscloudflareAdapter()(fromhono-preact/adapter-cloudflare) andnodeAdapter()(fromhono-preact/adapter-node); each supplies its own Vite plugins and entry wrapper. Node target uses@hono/node-serverand supports WebSockets via@hono/node-ws. create-hono-preactscaffold.pnpm create hono-preact my-app(ornpm create,yarn create) bootstraps a working project with the adapter wired in,pnpm installruns by default. Replaces the four-file copy/paste quick-start.- Unified middleware primitive.
defineServerMiddlewareanddefineClientMiddlewarereplacedefineServerGuard/defineClientGuard/ action guards. A singleusearray per scope (app / page / loader / action) drives the chain. Stream observers (defineStreamObserver) compose in the same array. - User middleware reaches
/__actionsand/__loaders. The user app (src/api.ts) now mounts ahead of the framework's reserved RPC paths, soapp.use('/__actions', csrf({...}))works. The Vite plugin fails the build if yourapi.tsshadows a reserved path with a catch-all route.
Breaking changes
Adapter is required
honoPreact() no longer ships with a hardcoded Cloudflare toolchain. Pass an adapter:
// vite.config.ts
import { honoPreact } from 'hono-preact/vite';
import { cloudflareAdapter } from 'hono-preact/adapter-cloudflare';
import { defineConfig } from 'vite';
export default defineConfig({
plugins: [honoPreact({ adapter: cloudflareAdapter() })],
});Install adapter peer deps for your target:
# Cloudflare Workers
npm install -D @cloudflare/vite-plugin wrangler
# Node.js (add @hono/node-ws for WebSockets)
npm install @hono/node-serverGuards replaced by middleware
defineServerGuard, defineClientGuard, createGuard, the serverGuards / clientGuards / actionGuards containers, and the guards: [...] page binding are gone. Migrate to defineServerMiddleware / defineClientMiddleware and the use array.
Before:
import { defineServerGuard, redirect } from 'hono-preact';
export const requireSession = defineServerGuard(async (ctx) => {
const user = await currentUser(ctx.c);
if (!user) throw redirect('/login');
});
// page.tsx
export default definePage(View, { guards: [requireSession] });
// page.server.ts
export const serverGuards = [requireSession];After:
import { defineServerMiddleware, redirect } from 'hono-preact';
export const requireSession = defineServerMiddleware(async (ctx, next) => {
const user = await currentUser(ctx.c);
if (!user) throw redirect('/login');
await next();
});
// page.tsx
export default definePage(View, { use: [requireSession] });
// page.server.ts
export const pageUse = [requireSession];The shape change is one extra line: call await next() after your check, instead of returning. The outcome throws (redirect, deny, render) are unchanged.
For module-wide gating that covers both loaders and actions in a .server.* file, export pageUse. See Middleware for the full chain model, scope rules, and stream-observer composition.
Fixes
Set-Cookiedelivered from streaming loaders. Cookies set viasetSignedCookie/setCookieinside a streaming loader now reach the client. The v0.1 known-limitation note is gone.- CSRF middleware reach. User-supplied middleware on
/__actionsand/__loadersis honored. v0.1 required SameSite-cookie defaults as the only CSRF mitigation; v0.2 lets you mounthono/csrfexplicitly.
Install
pnpm add hono-preact hono preact preact-iso preact-render-to-string hoofd
pnpm add -D vite
# Pick one adapter:
pnpm add -D @cloudflare/vite-plugin wrangler # Cloudflare Workers
pnpm add @hono/node-server # Node.js (add @hono/node-ws for WebSockets)Or scaffold a new project:
pnpm create hono-preact my-appDocs
Full docs: https://framework.sbesh.com/docs · Demo: https://framework.sbesh.com/demo