Routes on deeper path hide routes
SimonSimCity opened this issue · 5 comments
Describe the bug
In my project, I discovered that the type definition for RoutesNamesList
only contains the very nested route of a path but not its parent. Since its a bit hard to explain, imagine the following list of pages:
pages/track.vue
pages/track/[id].vue
This only generates typings for the route track-id
, but not for the route track
. I've created a small sandbox for this: https://stackblitz.com/edit/github-52carx
After running nuxi prepare
, the file .nuxt/typed-router/__routes.ts
contains types like this:
export type RoutesNamedLocations =
| { name: 'index' }
| {
name: 'track-id';
params: {
id: string | number;
};
};
Expected behavior
Types for both routes should be generated.
The type mentioned above should be something like:
export type RoutesNamedLocations =
| { name: 'index' }
| { name: 'track' }
| {
name: 'track-id';
params: {
id: string | number;
};
};
Screenshots
n/a
Environnement infos
Taken from the sandbox project:
- Operating System:
Linux
- Node Version:
v16.14.2
- Nuxt Version:
3.5.3
- Nitro Version:
2.4.1
- Package Manager:
npm@7.17.0
- Builder:
vite
- User Config:
modules
- Runtime Modules:
nuxt-typed-router@3.2.2
- Build Modules:
-
Your nuxt.config.ts
https://stackblitz.com/edit/github-52carx?file=nuxt.config.ts
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
modules: [['nuxt-typed-router', { strict: true }]],
});
Hi! That's not realy related to the way this module works but how Nuxt generates its routes, your route will not have a name if you don't put a index.vue
in the folder. I only generate what Nuxt gives me
Try adding "pages/track/index.vue" you will see the changes.
To understand look at vue devtools you will see "/track" don't have a route name
It's not a way for nested routes. I have similar issue with foldering structure:
pages/
account.vue
account/
profile.vue
addresses.vue
In this case account.vue will be the parent route with children routes
Yep but Nuxt will not assign a name for the route /account
until there is a pages/account/index.vue
. Can't do anything about it as it's the way Nuxt does it
Nice, it works when renaming the pages/track.vue
file to pages/track/index.vue
🎉
Just mentioning because nuxt didn't throw an error when I tried: It actually becomes pretty weird when having both a pages/track.vue
and a pages/track/index.vue
file 🤪
For me, this is fixed 🤗