⚠️
The vite-plugin-ssr project has been renamed Vike.
If you are already using vite-plugin-ssr then migrate to Vike.
For new projects, don't use vite-plugin-ssr but use Vike instead.

Route String

For a page /pages/film.page.js, a Route String can be defined in a /pages/film.page.route.js adjacent file.

// /pages/film.page.route.js

// Match URLs `/film/1`, `/film/2`, ...
export default '/film/@filmId'

The value of filmId is available at pageContext.routeParams.filmId.

Multiple Parameters

We can define multiple parameters.

// /pages/film.page.route.js

// Parameters available at:
//  - `pageContext.routeParams.year`
//  - `pageContext.routeParams.slug`
export default '/news/@year/@slug'

Catch-All

We can use Route Strings to implement catch-all routes.

Precedence

Upon Route String conflicts, vite-plugin-ssr chooses the first route from most specific to least specific.

See Routing > Routing Precedence.

Escape `@`

The special character @ cannot be escaped, use a Route Function instead.

Domain-driven file structure

As with Filesystem Routing a domain-driven file structure is possible, such as:

FILESYSTEM
user/pages/list.page.js
user/pages/list.page.route.js
user/pages/create.page.js
user/pages/create.page.route.js
todo/pages/list.page.js
todo/pages/list.page.route.js
todo/pages/create.page.js
todo/pages/create.page.route.js

For more advanced routing, we can use Route Functions which are fundamentally more powerful than Route Strings.

✍ Edit this page