Vitepress prepends previous route segment to next route

393 Views Asked by At

I have a Vitepress 1.0.0-alpha.40 project with the following configuration

import { defineConfig } from 'vitepress'

export default defineConfig({
    base: './',
    outDir: '../dist',
    themeConfig: {
        sidebar: [
            {
                text: 'Configuration',
                collapsible: true,
                items: [
                    {
                        text: 'Foo',
                        link: '/configuration/foo'
                    }
                ]
            },
            {
                text: 'Deployment',
                collapsible: true,
                items: [
                    {
                        text: 'Bar',
                        link: '/deployment/bar'
                    }
                ]
            }
        ]
    }
})

and the following folder structure

.
└── docs
    ├── .vitepress
    │   └── config.ts
    ├── configuration
    │   └── foo.md
    ├── deployment
    │    └── bar.md
    └── index.md

When running the application on http://localhost:5173/ I see the following

enter image description here

When clicking on the sidebar link Foo it works fine, the router navigates to

http://localhost:5173/configuration/foo.html

But when I now click Bar the router navigates to

http://localhost:5173/configuration/deployment/bar.html

which is wrong. The expected url would be

http://localhost:5173/deployment/bar.html

It seems it always adds the previous segment e.g. "/configuration".

Does someone know how to fix this behaviour?

1

There are 1 best solutions below

4
On

This happened because you put ./ in the base configuration.

Either put something other like / (default) or /base/.

Or remove the config altogether.