`route`

The route config determines the page's routing.

// /pages/product/+config.ts
 
import type { Config } from 'vike/types'
 
export default {
  route: '/product/@id'
} satisfies Config

// /pages/product/+Page.tsx
 
export default Page
 
/* This page can have URLs such as:
   /product/12345
   /product/macbook-pro
   /product/iPhone42
   ...
*/
function Page() {
  return <>
    <h1>Product Information</h1>
    {/* ... */}
  </>
}

Instead of a Route String, you can also define a Route Function:

// /pages/product/+route.ts
 
export { route }
 
import type { PageContext } from 'vike/types'
 
function route(pageContext: PageContext) {
  const parts = pageContext.urlPathname.split('/')
  if (parts[1] !== 'product') {
    return false
  } else {
    return {
      routeParams: {
        id: parts[2]
      }
    }
  }
}