Routing

Die Routen ergeben sich direkt aus dem Dateisystem unter src/.

src/
  index.ht.js              → /
  about.ht.js              → /about
  blog/
    index.ht.js            → /blog
    [slug].ht.js           → /blog/:slug
  docs/
    [...path]?.ht.js       → /docs, /docs/a, /docs/a/b, ...
  (admin)/
    users.ht.js            → /users
  404.ht.js                → dist/404.html

Routentabelle

Funktion	Datei	URL
Statisch	`index.ht.js`	`/`
Verschachtelt	`blog/index.ht.js`	`/blog`
Dynamisch	`blog/[slug].ht.js`	`/blog/my-post`
Mehrere Parameter	`blog/[year]/[slug].ht.js`	`/blog/2026/my-post`
Catch-all	`docs/[...path].ht.js`	`/docs/api/auth`
Optionales Catch-all	`docs/[...path]?.ht.js`	`/docs + tiefere Pfade`
Routengruppen	`(admin)/users.ht.js`	`/users`

Die spezifischere Route gewinnt: statisch schlägt dynamisch, dynamisch schlägt Catch-all. Zwei Dateien, die dieselbe URL erzeugen, sind ein Build-Fehler.

generateStaticParams

Dynamische Routen legen fest, welche Seiten beim Build erzeugt werden. In sitelo (dev) werden dynamische Routen weiterhin auf Anfrage gerendert, ohne dass du jeden Parameter auflisten musst.

export function generateStaticParams() {
  return [
    { slug: 'hello-world' },
    { slug: 'my-first-post' },
  ]
}

export default ({ params }) => `
  <html><body><h1>${params.slug}</h1></body></html>
`

import { html, body, h1 } from 'javascript-to-html'

export function generateStaticParams() {
  return [
    { slug: 'hello-world' },
    { slug: 'my-first-post' },
  ]
}

export default ({ params }) =>
  html(
    body(h1(params.slug))
  )

export function generateStaticParams() {
  return [
    { slug: 'hello-world' },
    { slug: 'my-first-post' },
  ]
}

export default function Post({ params }) {
  return (
    <html>
      <body>
        <h1>{params.slug}</h1>
      </body>
    </html>
  )
}

Werte dürfen Strings, Zahlen oder Booleans sein — sie werden in Strings umgewandelt und URL-kodiert. Catch-all-Parameter akzeptieren Arrays ({ path: ['a', 'b'] }) oder durch Schrägstriche getrennte Strings ({ path: 'a/b' }).

Eine dynamische Seite, die keine einzige Route erzeugt, gibt eine Warnung aus — so verschwindet sie nicht stillschweigend aus deiner Website.