v3.2.0 GitHub

Nested routes

Working with nested routes is pretty similar to Vue Router.

First, you should define children property in route:

routes:[
    {
        path: '/',
        component: Index,
        name: 'Index',
        children: [
            {
                path: 'nested',
                component: Nested,
                name: 'Nested'
            }
        ]
    },

Then, add into Index component RouterOutlet:

// Index.svelte
<script>
import { RouterOutlet } from '@easyroute/svelte'
</script>

<RouterOutlet />

Now you will see both rendered components on the screen.

Important:

Svelte Easyroute ecosystem uses Svelte context API. Context name is easyrouteContext. Never redefine it in your components!