I have a project using Vite and vite-plugin-pages https://github.com/hannoeru/vite-plugin-pages. The plugin has generated routes and I tried to add my own route and the routes can be seen as below :

0: {path: '/', component: {…}, children: Array(1)}
1: {path: '/readme', component: {…}, children: Array(1)}
2: {path: '/modal', component: {…}, children: Array(1)}
3: {path: '/table', component: {…}, children: Array(1)}

// below is routes that I've added
4: {path: '/:locale/', component: {…}, children: Array(1)} // component & children copy from '/'
5: {path: '/:locale/readme', component: {…}, children: Array(1)} // component & children copy from '/readme'
6: {path: '/:locale/modal', component: {…}, children: Array(1)} // ...etc
7: {path: '/:locale/table', component: {…}, children: Array(1)}
length: 8
[[Prototype]]: Array(0)

When I tried to access it with http://localhost:4000/jp/ it always shown blank page. Why did I do wrong? I tried change the config :

Pages({
      extensions: ["vue", "md"],
      dirs: [
        { dir: 'src/pages', baseRoute: ':locale' }
      ]
    }),

Then it works, but it can't access to http://localhost:4000/. And then I tried to add new dir :

Pages({
      extensions: ["vue", "md"],
      dirs: [
        { dir: 'src/pages', baseRoute: ':locale' },
        { dir: 'src/pages', baseRoute: '' }
      ]
    }),

It doesn't work same as before. What should I do?