framework
framework copied to clipboard
Improve custom routes docs
It is possible to add custom routes in multiple ways with Nuxt 3 but docs could be improved. (Routing or pages directory)
Ref: https://github.com/nuxt/framework/discussions/7211?converting=1#discussioncomment-3545577
is it possible to define subdomain with wildcard using new router.options.ts or pages:extend hook?
- router options gives me error
at <RouterView name=undefined route=undefined >
[nitro] [dev] [unhandledRejection] TypeError: Cannot read properties of undefined (reading 'replace')
at interpolatePath (C:/Work/xxx/Website/Code/xxx/Frontend/node_modules/.pnpm/[email protected][email protected]/node_modules/nuxt/dist/pages/runtime/utils.mjs:4:21)
at Module.generateRouteKey (C:/Work/xxx/Website/Code/xxx/Frontend/node_modules/.pnpm/[email protected][email protected]/node_modules/nuxt/dist/pages/runtime/utils.mjs:8:73)
at default (C:/Work/xxx/Website/Code/xxx/Frontend/node_modules/.pnpm/[email protected][email protected]/node_modules/nuxt/dist/pages/runtime/page.mjs:47:45)
at C:\Work\xxx\Website\Code\xxx\Frontend\node_modules\.pnpm\@[email protected]\node_modules\@vue\runtime-core\dist\runtime-core.cjs.js:4166:35
at renderFnWithContext (C:\Work\xxx\Website\Code\xxx\Frontend\node_modules\.pnpm\@[email protected]\node_modules\@vue\runtime-core\dist\runtime-core.cjs.js:842:21)
at normalizeSlot (file:///C:/Work/xxx/Website/Code/xxx/Frontend/node_modules/.pnpm/[email protected][email protected]/node_modules/vue-router/dist/vue-router.mjs:2455:25)
at Proxy.<anonymous> (file:///C:/Work/xxx/Website/Code/xxx/Frontend/node_modules/.pnpm/[email protected][email protected]/node_modules/vue-router/dist/vue-router.mjs:2447:13)
at renderComponentRoot (C:\Work\xxx\Website\Code\xxx\Frontend\node_modules\.pnpm\@[email protected]\node_modules\@vue\runtime-core\dist\runtime-core.cjs.js:885:44)
at renderComponentSubTree (C:\Work\xxx\Website\Code\xxx\Frontend\node_modules\.pnpm\@[email protected][email protected]\node_modules\@vue\server-renderer\dist\server-renderer.cjs.js:263:51)
at renderComponentVNode (C:\Work\xxx\Website\Code\xxx\Frontend\node_modules\.pnpm\@[email protected][email protected]\node_modules\@vue\server-renderer\dist\server-renderer.cjs.js:188:16)```
while using this code router.options.ts:
import type { RouterOptions } from '@nuxt/schema'
// https://router.vuejs.org/api/interfaces/routeroptions.html
export default <RouterOptions>{
routes: (_routes) => [
// console.log(_routes),
{
name: 'home',
route: '/*/',
component: () => import('~/pages/user.vue'),
},
],
}
- pages:extend simply ignores this route and goes straight to index.vue nuxt.config.ts:
hooks: {
'pages:extend'(pages) {
pages.push({
name: 'site.about',
path: '/*/',
file: '~/pages/user.vue',
})
},
},