LessJS 使用文件系统路由。一个页面文件对应一个 URL；特殊文件用于 layout wrapping、 middleware 和 API handlers。
app/routes 下的页面组件会被扫描成页面路由。 页面模块必须默认导出 Custom Element class，并导出 tagName。
| File | Route |
|---|---|
| app/routes/index.ts | / |
| app/routes/about.ts | /about |
| app/routes/docs/index.ts | /docs |
| app/routes/docs/install.ts | /docs/install |
方括号会转换成 Hono route params。SSR 时这些 params 会作为同名 property 写入页面组件。
| File | Route | Property |
|---|---|---|
| app/routes/posts/[slug].ts | /posts/:slug | slug |
| app/routes/users/[id]/posts.ts | /users/:id/posts | id |
export class PostPage extends LitElement {
slug = '';
override render() {
return html`<article>Post: ${this.slug}</article>`;
}
}| File | Purpose |
|---|---|
| _renderer.ts | Wraps SSR output for a route subtree. Use it for layout shells or document-level composition. |
| _middleware.ts | Mounts Hono middleware for a route subtree. Use it for headers, auth, CSP nonce and request guards. |
| api/*.ts | Defines Hono API handlers under the same file-system route tree. |
import { html, LitElement } from 'lit';
export class AboutPage extends LitElement {
override render() {
return html`<main>About</main>`;
}
}
customElements.define('page-about', AboutPage);
export default AboutPage;
export const tagName = 'page-about';路由扫描已经可以稳定处理页面、动态片段、renderer、middleware 和 API routes。 v0.5.3 已修复根级 _middleware.ts 的挂载范围—— 现在会正确生成 app.use('/*', ...) 覆盖整个路由树。