Blitz generates a Route Manifest for you. It allows you to refer to a page by name instead of location:
// Assume you have a page at app/pages/products/[productId].tsx
export default function ProductPage() { ...
// You can then use Routes...
import { Link, Routes } from "blitz"
// ...to refer to it by name...
<Link href={Routes.ProductsPage({ productId: 123 })} />
// ...instead of looking up the location!
<Link href={`/products/${123}`} />
The Route Manifest is a purely optional feature. It has some advantages, though:
Query parameters can be specified together with route parameters.
// instead of ...
<Link href={`/products/${pid}?offerCode=capybara`} />
// ... you can do:
<Link href={Routes.Product({ pid, offerCode: "capybara" })} />
The Route Manifest is generated into node_modules/.blitz
directly from
your source code into. Both blitz build
and
blitz dev
will automatically keep it up-to-date.
If you need to manually generate the route manifest, for example for a
typecheck in CI, use blitz codegen
.