Improve repro and add patch fix

.yarn/patches/unplugin-vue-router-npm-0.15.0-3553b12b9d.patch

@@ -0,0 +1,22 @@
+diff --git a/dist/src-BVnnbDr_.js b/dist/src-BVnnbDr_.js
+index 947ef66e9fe1a90bf87df9647788ec0c8e0b8562..11d5a8975594423c3dfe431275fca592e5d9db0d 100644
+--- a/dist/src-BVnnbDr_.js
++++ b/dist/src-BVnnbDr_.js
+@@ -670,13 +670,13 @@ ${code}
+ * Generate the route file info for a non-root node.
+ */
+ function generateRouteFileInfoLines(node, rootDir) {
+-	const children = node.children.size > 0 ? node.getChildrenDeepSorted() : null;
+-	const childrenNamedViews = children ? Array.from(new Set(children.flatMap((child) => Array.from(child.value.components.keys())))) : null;
+-	const routeNames = [node, ...node.getChildrenDeepSorted()].filter((node$1) => !!node$1.name).map((node$1) => node$1.name);
++	const deepChildren = node.children.size > 0 ? node.getChildrenDeepSorted() : null;
++	const deepChildrenNamedViews = deepChildren ? Array.from(new Set(deepChildren.flatMap((child) => Array.from(child.value.components.keys())))) : null;
++	const routeNames = [node, ...(deepChildren ?? [])].filter((node$1) => node$1.value.components.size > 0 && !!node$1.name).map((node$1) => node$1.name);
+ 	const currentRouteInfo = routeNames.length === 0 ? [] : Array.from(node.value.components.values()).map((file) => ({
+ 		key: relative(rootDir, file).replaceAll("\\", "/"),
+ 		routeNames,
+-		childrenNamedViews
++		childrenNamedViews: deepChildrenNamedViews
+ 	}));
+ 	const childrenRouteInfo = node.getChildrenSorted().flatMap((child) => generateRouteFileInfoLines(child, rootDir));
+ 	return currentRouteInfo.concat(childrenRouteInfo);

package.json

@@ -32,8 +32,9 @@
     "unplugin-auto-import": "^19.3.0",
     "unplugin-fonts": "^1.4.0",
     "unplugin-vue-components": "^28.8.0",
-    "unplugin-vue-router": "^0.15.0",
+    "unplugin-vue-router": "patch:unplugin-vue-router@npm%3A0.15.0#~/.yarn/patches/unplugin-vue-router-npm-0.15.0-3553b12b9d.patch",
     "vite": "^6.3.5",
+    "vite-plugin-vue-devtools": "^8.0.0",
     "vite-plugin-vue-layouts-next": "^1.0.0",
     "vite-plugin-vuetify": "^2.1.2",
     "vue-router": "^4.5.1",

src/pages/suppliers/[id].vue

@@ -1,7 +1,14 @@
 <template>
-  <div>Test</div>
+  <div>
+    <h1>Supplier {{ route.params.id }}</h1>
+    <router-view />
+  </div>
 </template>
 <script setup lang="ts">
   const route = useRoute()
   console.log(route.params.id)
+
+  // eslint-disable-next-line @typescript-eslint/consistent-type-imports
+  type RouteNamesForThisFilePath = import('vue-router/auto-routes')._RouteNamesForFilePath<'src/pages/suppliers/[id].vue'>;
+  const route2 = useRoute<RouteNamesForThisFilePath>();
 </script>

src/pages/suppliers/[id]/index.vue

@@ -0,0 +1,6 @@
+<template>
+  <ul>
+    <li><router-link :to="{ name: '/suppliers/[id]/products/[[product]]+', params: { id: $route.params.id } }">Products</router-link></li>
+    <li><router-link :to="{ name: '/suppliers/[id]/results/[[version]]', params: { id: $route.params.id } }">Results</router-link></li>
+  </ul>
+</template>

src/pages/suppliers/[id]/products/[[product]]+.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <template v-if="route.params.product">
+      <h2>
+        Product {{ route.params.product.join(' > ') }}
+      </h2>
+    </template>
+    <template v-else>
+      <h2>All products</h2>
+      <ul>
+        <li><router-link :to="{ name: '/suppliers/[id]/products/[[product]]+', params: { id: route.params.id, product: ['1'] } }">Example productcategory</router-link></li>
+        <li><router-link :to="{ name: '/suppliers/[id]/products/[[product]]+', params: { id: route.params.id, product: ['1', '2'] } }">Example product</router-link></li>
+      </ul>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+  const route = useRoute()
+  console.log(route.params.id, route.params.product)
+</script>

src/pages/suppliers/[id]/results/[[version]].vue

@@ -1,8 +1,21 @@
 <template>
-  <div>Test</div>
+  <div>
+    <template v-if="route.params.version">
+      <h2>
+        Result {{ route.params.version }}
+      </h2>
+    </template>
+    <template v-else>
+      <h2>All results</h2>
+      <ul>
+        <li><router-link :to="{ name: '/suppliers/[id]/results/[[version]]', params: { id: route.params.id, version: '1' } }">Example result 1</router-link></li>
+        <li><router-link :to="{ name: '/suppliers/[id]/results/[[version]]', params: { id: route.params.id, version: '2' } }">Example result 2</router-link></li>
+      </ul>
+    </template>
+  </div>
 </template>
 
 <script setup lang="ts">
   const route = useRoute()
-  console.log(route.params.id)
+  console.log(route.params.id, route.params.version)
 </script>

src/pages/suppliers/index.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>
+    <h2>
+      All suppliers
+    </h2>
+    <ul>
+      <li><router-link :to="{ name: '/suppliers/[id]/', params: { id: '1' } }">Example supplier 1</router-link></li>
+      <li><router-link :to="{ name: '/suppliers/[id]/', params: { id: '2' } }">Example supplier 2</router-link></li>
+    </ul>
+  </div>
+</template>

src/typed-router.d.ts

@@ -19,7 +19,10 @@ declare module 'vue-router/auto-routes' {
    */
   export interface RouteNamedMap {
     '/': RouteRecordInfo<'/', '/', Record<never, never>, Record<never, never>>,
-    '/suppliers/[id]': RouteRecordInfo<'/suppliers/[id]', '/suppliers/:id', { id: ParamValue<true> }, { id: ParamValue<false> }, '/suppliers/[id]/results/[[version]]'>,
+    '/suppliers/': RouteRecordInfo<'/suppliers/', '/suppliers', Record<never, never>, Record<never, never>>,
+    '/suppliers/[id]': RouteRecordInfo<'/suppliers/[id]', '/suppliers/:id', { id: ParamValue<true> }, { id: ParamValue<false> }, '/suppliers/[id]/' | '/suppliers/[id]/products/[[product]]+' | '/suppliers/[id]/results/[[version]]'>,
+    '/suppliers/[id]/': RouteRecordInfo<'/suppliers/[id]/', '/suppliers/:id', { id: ParamValue<true> }, { id: ParamValue<false> }>,
+    '/suppliers/[id]/products/[[product]]+': RouteRecordInfo<'/suppliers/[id]/products/[[product]]+', '/suppliers/:id/products/:product*', { id: ParamValue<true>, product?: ParamValueZeroOrMore<true> }, { id: ParamValue<false>, product?: ParamValueZeroOrMore<false> }>,
     '/suppliers/[id]/results/[[version]]': RouteRecordInfo<'/suppliers/[id]/results/[[version]]', '/suppliers/:id/results/:version?', { id: ParamValue<true>, version?: ParamValueZeroOrOne<true> }, { id: ParamValue<false>, version?: ParamValueZeroOrOne<false> }>,
   }
 
@@ -38,10 +41,22 @@ declare module 'vue-router/auto-routes' {
       routes: '/'
       views: never
     }
+    'src/pages/suppliers/index.vue': {
+      routes: '/suppliers/'
+      views: never
+    }
     'src/pages/suppliers/[id].vue': {
-      routes: '/suppliers/[id]' | '/suppliers/[id]/results/[[version]]' | '/suppliers/[id]/results'
+      routes: '/suppliers/[id]' | '/suppliers/[id]/' | '/suppliers/[id]/products/[[product]]+' | '/suppliers/[id]/results/[[version]]'
       views: 'default'
     }
+    'src/pages/suppliers/[id]/index.vue': {
+      routes: '/suppliers/[id]/'
+      views: never
+    }
+    'src/pages/suppliers/[id]/products/[[product]]+.vue': {
+      routes: '/suppliers/[id]/products/[[product]]+'
+      views: never
+    }
     'src/pages/suppliers/[id]/results/[[version]].vue': {
       routes: '/suppliers/[id]/results/[[version]]'
       views: never

vite.config.mts

@@ -1,4 +1,5 @@
 // Plugins
+import VueDevTools from 'vite-plugin-vue-devtools'
 import AutoImport from 'unplugin-auto-import/vite'
 import Components from 'unplugin-vue-components/vite'
 import Fonts from 'unplugin-fonts/vite'
@@ -15,6 +16,7 @@ import { fileURLToPath, URL } from 'node:url'
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [
+    VueDevTools(),
     VueRouter({
       dts: 'src/typed-router.d.ts',
     }),