Filesystem Routing

By default, Vike does Filesystem Routing: the URL of a page is determined based on where its +Page.js (or +config.js) file is located on the filesystem.

FILESYSTEM                   URL
========================     =================================
pages/about/+Page.js         /about
# `index` is mapped to the empty string
pages/index/+Page.js         /
# Case sensitive
pages/HELLO/+Page.js         /HELLO
# Route parameter
pages/movie/@id/+Page.js     /movie/1, /movie/2, /movie/3, ...

Filesystem Routing ignores all the following directories:

  • index/
  • pages/
  • src/

For example:

FILESYSTEM                                          URL
==============================================      ========
src/pages/jobs/+Page.js                             /jobs
pages/pages/src/src/index/pages/about/+Page.js      /about
contact/+Page.js                                    /contact

This enables you to implement a domain-driven file structure such as:

FILESYSTEM                         URL
==========================         ============
user/pages/list/+Page.js           /user/list
user/pages/create/+Page.js         /user/create
todo/pages/list/+Page.js           /todo/list
todo/pages/create/+Page.js         /todo/create

You can change the URL root of Filesystem Routing by using filesystemRoutingRoot.

For more advanced routing, use Route Strings and Route Functions.