From f1afae99cd7bce5d859ff2a90043ecc79477543e Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 12 Apr 2023 15:55:23 +0200
Subject: [PATCH 01/52] feat: add experimental typedPages option

---
 packages/nuxt/src/core/nuxt.ts             |   7 +-
 packages/nuxt/src/pages/module-typed.ts    | 290 +++++++++++++++++++++
 packages/schema/src/config/experimental.ts |   3 +
 3 files changed, 299 insertions(+), 1 deletion(-)
 create mode 100644 packages/nuxt/src/pages/module-typed.ts

diff --git a/packages/nuxt/src/core/nuxt.ts b/packages/nuxt/src/core/nuxt.ts
index 638fd6a29ba2..1f4978b7a744 100644
--- a/packages/nuxt/src/core/nuxt.ts
+++ b/packages/nuxt/src/core/nuxt.ts
@@ -9,6 +9,7 @@ import fse from 'fs-extra'
 import { withoutLeadingSlash } from 'ufo'
 /* eslint-disable import/no-restricted-paths */
 import pagesModule from '../pages/module'
+import typedPagesModule from '../pages/module-typed'
 import metaModule from '../head/module'
 import componentsModule from '../components/module'
 import importsModule from '../imports/module'
@@ -358,7 +359,11 @@ export async function loadNuxt (opts: LoadNuxtOptions): Promise<Nuxt> {
   // Temporary until finding better placement for each
   options.appDir = options.alias['#app'] = resolve(distDir, 'app')
   options._majorVersion = 3
-  options._modules.push(pagesModule, metaModule, componentsModule)
+  options._modules.push(
+    options.experimental.typedPages ? typedPagesModule : pagesModule,
+    metaModule,
+    componentsModule
+  );
   options._modules.push([importsModule, {
     transform: {
       include: options._layers
diff --git a/packages/nuxt/src/pages/module-typed.ts b/packages/nuxt/src/pages/module-typed.ts
new file mode 100644
index 000000000000..8997954d9a03
--- /dev/null
+++ b/packages/nuxt/src/pages/module-typed.ts
@@ -0,0 +1,290 @@
+import { existsSync, readdirSync } from 'node:fs'
+import { addComponent, addPlugin, addTemplate, addVitePlugin, addWebpackPlugin, defineNuxtModule, findPath, updateTemplates } from '@nuxt/kit'
+import { join, relative, resolve } from 'pathe'
+import { genImport, genObjectFromRawEntries, genString } from 'knitwork'
+import escapeRE from 'escape-string-regexp'
+import { joinURL } from 'ufo'
+import type { NuxtApp, NuxtPage } from 'nuxt/schema'
+
+import { distDir } from '../dirs'
+import { normalizeRoutes, resolvePagesRoutes } from './utils'
+import type { PageMetaPluginOptions } from './page-meta'
+import { PageMetaPlugin } from './page-meta'
+
+export default defineNuxtModule({
+  meta: {
+    name: 'pages'
+  },
+  setup (_options, nuxt) {
+    const pagesDirs = nuxt.options._layers.map(
+      layer => resolve(layer.config.srcDir, layer.config.dir?.pages || 'pages')
+    )
+
+    // Disable module (and use universal router) if pages dir do not exists or user has disabled it
+    const isNonEmptyDir = (dir: string) => existsSync(dir) && readdirSync(dir).length
+    const userPreference = nuxt.options.pages
+    const isPagesEnabled = () => {
+      if (typeof userPreference === 'boolean') {
+        return userPreference
+      }
+      if (nuxt.options._layers.some(layer => existsSync(resolve(layer.config.srcDir, 'app/router.options.ts')))) {
+        return true
+      }
+      if (pagesDirs.some(dir => isNonEmptyDir(dir))) {
+        return true
+      }
+      return false
+    }
+    nuxt.options.pages = isPagesEnabled()
+
+    // Restart Nuxt when pages dir is added or removed
+    const restartPaths = nuxt.options._layers.flatMap(layer => [
+      join(layer.config.srcDir, 'app/router.options.ts'),
+      join(layer.config.srcDir, layer.config.dir?.pages || 'pages')
+    ])
+    nuxt.hooks.hook('builder:watch', (event, path) => {
+      const fullPath = join(nuxt.options.srcDir, path)
+      if (restartPaths.some(path => path === fullPath || fullPath.startsWith(path + '/'))) {
+        const newSetting = isPagesEnabled()
+        if (nuxt.options.pages !== newSetting) {
+          console.info('Pages', newSetting ? 'enabled' : 'disabled')
+          return nuxt.callHook('restart')
+        }
+      }
+    })
+
+    if (!nuxt.options.pages) {
+      addPlugin(resolve(distDir, 'app/plugins/router'))
+      addTemplate({
+        filename: 'pages.mjs',
+        getContents: () => 'export { useRoute } from \'#app\''
+      })
+      addComponent({
+        name: 'NuxtPage',
+        priority: 10, // built-in that we do not expect the user to override
+        filePath: resolve(distDir, 'pages/runtime/page-placeholder')
+      })
+      return
+    }
+
+    const runtimeDir = resolve(distDir, 'pages/runtime')
+
+    // Add $router types
+    nuxt.hook('prepare:types', ({ references }) => {
+      references.push({ types: 'vue-router' })
+    })
+
+    // Add vue-router route guard imports
+    nuxt.hook('imports:sources', (sources) => {
+      const routerImports = sources.find(s => s.from === '#app' && s.imports.includes('onBeforeRouteLeave'))
+      if (routerImports) {
+        routerImports.from = 'vue-router'
+      }
+    })
+
+    // Regenerate templates when adding or removing pages
+    nuxt.hook('builder:watch', async (event, path) => {
+      const dirs = [
+        nuxt.options.dir.pages,
+        nuxt.options.dir.layouts,
+        nuxt.options.dir.middleware
+      ].filter(Boolean)
+
+      const pathPattern = new RegExp(`(^|\\/)(${dirs.map(escapeRE).join('|')})/`)
+      if (event !== 'change' && path.match(pathPattern)) {
+        await updateTemplates({
+          filter: template => template.filename === 'routes.mjs'
+        })
+      }
+    })
+
+    nuxt.hook('app:resolve', (app) => {
+      // Add default layout for pages
+      if (app.mainComponent!.includes('@nuxt/ui-templates')) {
+        app.mainComponent = resolve(runtimeDir, 'app.vue')
+      }
+      app.middleware.unshift({
+        name: 'validate',
+        path: resolve(runtimeDir, 'validate'),
+        global: true
+      })
+    })
+
+    // Prerender all non-dynamic page routes when generating app
+    if (!nuxt.options.dev && nuxt.options._generate) {
+      const prerenderRoutes = new Set<string>()
+      nuxt.hook('modules:done', () => {
+        nuxt.hook('pages:extend', (pages) => {
+          prerenderRoutes.clear()
+          const processPages = (pages: NuxtPage[], currentPath = '/') => {
+            for (const page of pages) {
+              // Add root of optional dynamic paths and catchalls
+              if (page.path.match(/^\/?:.*(\?|\(\.\*\)\*)$/) && !page.children?.length) { prerenderRoutes.add(currentPath) }
+              // Skip dynamic paths
+              if (page.path.includes(':')) { continue }
+              const route = joinURL(currentPath, page.path)
+              prerenderRoutes.add(route)
+              if (page.children) { processPages(page.children, route) }
+            }
+          }
+          processPages(pages)
+        })
+      })
+      nuxt.hook('nitro:build:before', (nitro) => {
+        for (const route of nitro.options.prerender.routes || []) {
+          // Skip default route value as we only generate it if it is already
+          // in the detected routes from `~/pages`.
+          if (route === '/') { continue }
+          prerenderRoutes.add(route)
+        }
+        nitro.options.prerender.routes = Array.from(prerenderRoutes)
+      })
+    }
+
+    nuxt.hook('imports:extend', (imports) => {
+      imports.push(
+        { name: 'definePageMeta', as: 'definePageMeta', from: resolve(runtimeDir, 'composables') },
+        { name: 'useLink', as: 'useLink', from: 'vue-router' }
+      )
+    })
+
+    // Extract macros from pages
+    const pageMetaOptions: PageMetaPluginOptions = {
+      dev: nuxt.options.dev,
+      sourcemap: nuxt.options.sourcemap.server || nuxt.options.sourcemap.client,
+      dirs: nuxt.options._layers.map(
+        layer => resolve(layer.config.srcDir, layer.config.dir?.pages || 'pages')
+      )
+    }
+    nuxt.hook('modules:done', () => {
+      addVitePlugin(PageMetaPlugin.vite(pageMetaOptions))
+      addWebpackPlugin(PageMetaPlugin.webpack(pageMetaOptions))
+    })
+
+    // Add prefetching support for middleware & layouts
+    addPlugin(resolve(runtimeDir, 'plugins/prefetch.client'))
+
+    // Add router plugin
+    addPlugin(resolve(runtimeDir, 'plugins/router'))
+
+    const getSources = (pages: NuxtPage[]): string[] => pages
+      .filter(p => Boolean(p.file))
+      .flatMap(p =>
+        [relative(nuxt.options.srcDir, p.file as string), ...getSources(p.children || [])]
+      )
+
+    // Do not prefetch page chunks
+    nuxt.hook('build:manifest', async (manifest) => {
+      if (nuxt.options.dev) { return }
+      const pages = await resolvePagesRoutes()
+      await nuxt.callHook('pages:extend', pages)
+
+      const sourceFiles = getSources(pages)
+      for (const key in manifest) {
+        if (manifest[key].isEntry) {
+          manifest[key].dynamicImports =
+            manifest[key].dynamicImports?.filter(i => !sourceFiles.includes(i))
+        }
+      }
+    })
+
+    // Add routes template
+    addTemplate({
+      filename: 'routes.mjs',
+      async getContents () {
+        const pages = await resolvePagesRoutes()
+        await nuxt.callHook('pages:extend', pages)
+        const { routes, imports } = normalizeRoutes(pages)
+        return [...imports, `export default ${routes}`].join('\n')
+      }
+    })
+
+    // Add vue-router import for `<NuxtLayout>` integration
+    addTemplate({
+      filename: 'pages.mjs',
+      getContents: () => 'export { useRoute } from \'vue-router\''
+    })
+
+    // Optimize vue-router to ensure we share the same injection symbol
+    nuxt.options.vite.optimizeDeps = nuxt.options.vite.optimizeDeps || {}
+    nuxt.options.vite.optimizeDeps.include = nuxt.options.vite.optimizeDeps.include || []
+    nuxt.options.vite.optimizeDeps.include.push('vue-router')
+
+    nuxt.options.vite.resolve = nuxt.options.vite.resolve || {}
+    nuxt.options.vite.resolve.dedupe = nuxt.options.vite.resolve.dedupe || []
+    nuxt.options.vite.resolve.dedupe.push('vue-router')
+
+    // Add router options template
+    addTemplate({
+      filename: 'router.options.mjs',
+      getContents: async () => {
+        // Scan and register app/router.options files
+        const routerOptionsFiles = (await Promise.all(nuxt.options._layers.map(
+          async layer => await findPath(resolve(layer.config.srcDir, 'app/router.options'))
+        ))).filter(Boolean) as string[]
+
+        // Add default options
+        routerOptionsFiles.push(resolve(runtimeDir, 'router.options'))
+
+        const configRouterOptions = genObjectFromRawEntries(Object.entries(nuxt.options.router.options)
+          .map(([key, value]) => [key, genString(value as string)]))
+
+        return [
+          ...routerOptionsFiles.map((file, index) => genImport(file, `routerOptions${index}`)),
+          `const configRouterOptions = ${configRouterOptions}`,
+          'export default {',
+          '...configRouterOptions,',
+          // We need to reverse spreading order to respect layers priority
+          ...routerOptionsFiles.map((_, index) => `...routerOptions${index},`).reverse(),
+          '}'
+        ].join('\n')
+      }
+    })
+
+    addTemplate({
+      filename: 'types/middleware.d.ts',
+      getContents: ({ app }: { app: NuxtApp }) => {
+        const composablesFile = resolve(runtimeDir, 'composables')
+        const namedMiddleware = app.middleware.filter(mw => !mw.global)
+        return [
+          'import type { NavigationGuard } from \'vue-router\'',
+          `export type MiddlewareKey = ${namedMiddleware.map(mw => genString(mw.name)).join(' | ') || 'string'}`,
+          `declare module ${genString(composablesFile)} {`,
+          '  interface PageMeta {',
+          '    middleware?: MiddlewareKey | NavigationGuard | Array<MiddlewareKey | NavigationGuard>',
+          '  }',
+          '}'
+        ].join('\n')
+      }
+    })
+
+    addTemplate({
+      filename: 'types/layouts.d.ts',
+      getContents: ({ app }: { app: NuxtApp }) => {
+        const composablesFile = resolve(runtimeDir, 'composables')
+        return [
+          'import { ComputedRef, Ref } from \'vue\'',
+          `export type LayoutKey = ${Object.keys(app.layouts).map(name => genString(name)).join(' | ') || 'string'}`,
+          `declare module ${genString(composablesFile)} {`,
+          '  interface PageMeta {',
+          '    layout?: false | LayoutKey | Ref<LayoutKey> | ComputedRef<LayoutKey>',
+          '  }',
+          '}'
+        ].join('\n')
+      }
+    })
+
+    // Add <NuxtPage>
+    addComponent({
+      name: 'NuxtPage',
+      priority: 10, // built-in that we do not expect the user to override
+      filePath: resolve(distDir, 'pages/runtime/page')
+    })
+
+    // Add declarations for middleware keys
+    nuxt.hook('prepare:types', ({ references }) => {
+      references.push({ path: resolve(nuxt.options.buildDir, 'types/middleware.d.ts') })
+      references.push({ path: resolve(nuxt.options.buildDir, 'types/layouts.d.ts') })
+    })
+  }
+})
diff --git a/packages/schema/src/config/experimental.ts b/packages/schema/src/config/experimental.ts
index 005110a0b4d0..ddfa18d1f879 100644
--- a/packages/schema/src/config/experimental.ts
+++ b/packages/schema/src/config/experimental.ts
@@ -161,5 +161,8 @@ export default defineUntypedSchema({
 
     /** Resolve `~`, `~~`, `@` and `@@` aliases located within layers with respect to their layer source and root directories. */
     localLayerAliases: true,
+
+    /** Enable the new experimental typed router using [unplugin-vue-router](https://github.com/posva/unplugin-vue-router). */
+    typedPages: false
   }
 })

From 316a288607ddf87a1b7c6d2cae17562296c7e9d1 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 12 Apr 2023 16:34:55 +0200
Subject: [PATCH 02/52] refactor: contain changes within pages

---
 packages/nuxt/src/core/nuxt.ts          |   3 +-
 packages/nuxt/src/pages/module-typed.ts | 290 ------------------------
 2 files changed, 1 insertion(+), 292 deletions(-)
 delete mode 100644 packages/nuxt/src/pages/module-typed.ts

diff --git a/packages/nuxt/src/core/nuxt.ts b/packages/nuxt/src/core/nuxt.ts
index 1f4978b7a744..5c38493bafc8 100644
--- a/packages/nuxt/src/core/nuxt.ts
+++ b/packages/nuxt/src/core/nuxt.ts
@@ -9,7 +9,6 @@ import fse from 'fs-extra'
 import { withoutLeadingSlash } from 'ufo'
 /* eslint-disable import/no-restricted-paths */
 import pagesModule from '../pages/module'
-import typedPagesModule from '../pages/module-typed'
 import metaModule from '../head/module'
 import componentsModule from '../components/module'
 import importsModule from '../imports/module'
@@ -360,7 +359,7 @@ export async function loadNuxt (opts: LoadNuxtOptions): Promise<Nuxt> {
   options.appDir = options.alias['#app'] = resolve(distDir, 'app')
   options._majorVersion = 3
   options._modules.push(
-    options.experimental.typedPages ? typedPagesModule : pagesModule,
+    pagesModule,
     metaModule,
     componentsModule
   );
diff --git a/packages/nuxt/src/pages/module-typed.ts b/packages/nuxt/src/pages/module-typed.ts
deleted file mode 100644
index 8997954d9a03..000000000000
--- a/packages/nuxt/src/pages/module-typed.ts
+++ /dev/null
@@ -1,290 +0,0 @@
-import { existsSync, readdirSync } from 'node:fs'
-import { addComponent, addPlugin, addTemplate, addVitePlugin, addWebpackPlugin, defineNuxtModule, findPath, updateTemplates } from '@nuxt/kit'
-import { join, relative, resolve } from 'pathe'
-import { genImport, genObjectFromRawEntries, genString } from 'knitwork'
-import escapeRE from 'escape-string-regexp'
-import { joinURL } from 'ufo'
-import type { NuxtApp, NuxtPage } from 'nuxt/schema'
-
-import { distDir } from '../dirs'
-import { normalizeRoutes, resolvePagesRoutes } from './utils'
-import type { PageMetaPluginOptions } from './page-meta'
-import { PageMetaPlugin } from './page-meta'
-
-export default defineNuxtModule({
-  meta: {
-    name: 'pages'
-  },
-  setup (_options, nuxt) {
-    const pagesDirs = nuxt.options._layers.map(
-      layer => resolve(layer.config.srcDir, layer.config.dir?.pages || 'pages')
-    )
-
-    // Disable module (and use universal router) if pages dir do not exists or user has disabled it
-    const isNonEmptyDir = (dir: string) => existsSync(dir) && readdirSync(dir).length
-    const userPreference = nuxt.options.pages
-    const isPagesEnabled = () => {
-      if (typeof userPreference === 'boolean') {
-        return userPreference
-      }
-      if (nuxt.options._layers.some(layer => existsSync(resolve(layer.config.srcDir, 'app/router.options.ts')))) {
-        return true
-      }
-      if (pagesDirs.some(dir => isNonEmptyDir(dir))) {
-        return true
-      }
-      return false
-    }
-    nuxt.options.pages = isPagesEnabled()
-
-    // Restart Nuxt when pages dir is added or removed
-    const restartPaths = nuxt.options._layers.flatMap(layer => [
-      join(layer.config.srcDir, 'app/router.options.ts'),
-      join(layer.config.srcDir, layer.config.dir?.pages || 'pages')
-    ])
-    nuxt.hooks.hook('builder:watch', (event, path) => {
-      const fullPath = join(nuxt.options.srcDir, path)
-      if (restartPaths.some(path => path === fullPath || fullPath.startsWith(path + '/'))) {
-        const newSetting = isPagesEnabled()
-        if (nuxt.options.pages !== newSetting) {
-          console.info('Pages', newSetting ? 'enabled' : 'disabled')
-          return nuxt.callHook('restart')
-        }
-      }
-    })
-
-    if (!nuxt.options.pages) {
-      addPlugin(resolve(distDir, 'app/plugins/router'))
-      addTemplate({
-        filename: 'pages.mjs',
-        getContents: () => 'export { useRoute } from \'#app\''
-      })
-      addComponent({
-        name: 'NuxtPage',
-        priority: 10, // built-in that we do not expect the user to override
-        filePath: resolve(distDir, 'pages/runtime/page-placeholder')
-      })
-      return
-    }
-
-    const runtimeDir = resolve(distDir, 'pages/runtime')
-
-    // Add $router types
-    nuxt.hook('prepare:types', ({ references }) => {
-      references.push({ types: 'vue-router' })
-    })
-
-    // Add vue-router route guard imports
-    nuxt.hook('imports:sources', (sources) => {
-      const routerImports = sources.find(s => s.from === '#app' && s.imports.includes('onBeforeRouteLeave'))
-      if (routerImports) {
-        routerImports.from = 'vue-router'
-      }
-    })
-
-    // Regenerate templates when adding or removing pages
-    nuxt.hook('builder:watch', async (event, path) => {
-      const dirs = [
-        nuxt.options.dir.pages,
-        nuxt.options.dir.layouts,
-        nuxt.options.dir.middleware
-      ].filter(Boolean)
-
-      const pathPattern = new RegExp(`(^|\\/)(${dirs.map(escapeRE).join('|')})/`)
-      if (event !== 'change' && path.match(pathPattern)) {
-        await updateTemplates({
-          filter: template => template.filename === 'routes.mjs'
-        })
-      }
-    })
-
-    nuxt.hook('app:resolve', (app) => {
-      // Add default layout for pages
-      if (app.mainComponent!.includes('@nuxt/ui-templates')) {
-        app.mainComponent = resolve(runtimeDir, 'app.vue')
-      }
-      app.middleware.unshift({
-        name: 'validate',
-        path: resolve(runtimeDir, 'validate'),
-        global: true
-      })
-    })
-
-    // Prerender all non-dynamic page routes when generating app
-    if (!nuxt.options.dev && nuxt.options._generate) {
-      const prerenderRoutes = new Set<string>()
-      nuxt.hook('modules:done', () => {
-        nuxt.hook('pages:extend', (pages) => {
-          prerenderRoutes.clear()
-          const processPages = (pages: NuxtPage[], currentPath = '/') => {
-            for (const page of pages) {
-              // Add root of optional dynamic paths and catchalls
-              if (page.path.match(/^\/?:.*(\?|\(\.\*\)\*)$/) && !page.children?.length) { prerenderRoutes.add(currentPath) }
-              // Skip dynamic paths
-              if (page.path.includes(':')) { continue }
-              const route = joinURL(currentPath, page.path)
-              prerenderRoutes.add(route)
-              if (page.children) { processPages(page.children, route) }
-            }
-          }
-          processPages(pages)
-        })
-      })
-      nuxt.hook('nitro:build:before', (nitro) => {
-        for (const route of nitro.options.prerender.routes || []) {
-          // Skip default route value as we only generate it if it is already
-          // in the detected routes from `~/pages`.
-          if (route === '/') { continue }
-          prerenderRoutes.add(route)
-        }
-        nitro.options.prerender.routes = Array.from(prerenderRoutes)
-      })
-    }
-
-    nuxt.hook('imports:extend', (imports) => {
-      imports.push(
-        { name: 'definePageMeta', as: 'definePageMeta', from: resolve(runtimeDir, 'composables') },
-        { name: 'useLink', as: 'useLink', from: 'vue-router' }
-      )
-    })
-
-    // Extract macros from pages
-    const pageMetaOptions: PageMetaPluginOptions = {
-      dev: nuxt.options.dev,
-      sourcemap: nuxt.options.sourcemap.server || nuxt.options.sourcemap.client,
-      dirs: nuxt.options._layers.map(
-        layer => resolve(layer.config.srcDir, layer.config.dir?.pages || 'pages')
-      )
-    }
-    nuxt.hook('modules:done', () => {
-      addVitePlugin(PageMetaPlugin.vite(pageMetaOptions))
-      addWebpackPlugin(PageMetaPlugin.webpack(pageMetaOptions))
-    })
-
-    // Add prefetching support for middleware & layouts
-    addPlugin(resolve(runtimeDir, 'plugins/prefetch.client'))
-
-    // Add router plugin
-    addPlugin(resolve(runtimeDir, 'plugins/router'))
-
-    const getSources = (pages: NuxtPage[]): string[] => pages
-      .filter(p => Boolean(p.file))
-      .flatMap(p =>
-        [relative(nuxt.options.srcDir, p.file as string), ...getSources(p.children || [])]
-      )
-
-    // Do not prefetch page chunks
-    nuxt.hook('build:manifest', async (manifest) => {
-      if (nuxt.options.dev) { return }
-      const pages = await resolvePagesRoutes()
-      await nuxt.callHook('pages:extend', pages)
-
-      const sourceFiles = getSources(pages)
-      for (const key in manifest) {
-        if (manifest[key].isEntry) {
-          manifest[key].dynamicImports =
-            manifest[key].dynamicImports?.filter(i => !sourceFiles.includes(i))
-        }
-      }
-    })
-
-    // Add routes template
-    addTemplate({
-      filename: 'routes.mjs',
-      async getContents () {
-        const pages = await resolvePagesRoutes()
-        await nuxt.callHook('pages:extend', pages)
-        const { routes, imports } = normalizeRoutes(pages)
-        return [...imports, `export default ${routes}`].join('\n')
-      }
-    })
-
-    // Add vue-router import for `<NuxtLayout>` integration
-    addTemplate({
-      filename: 'pages.mjs',
-      getContents: () => 'export { useRoute } from \'vue-router\''
-    })
-
-    // Optimize vue-router to ensure we share the same injection symbol
-    nuxt.options.vite.optimizeDeps = nuxt.options.vite.optimizeDeps || {}
-    nuxt.options.vite.optimizeDeps.include = nuxt.options.vite.optimizeDeps.include || []
-    nuxt.options.vite.optimizeDeps.include.push('vue-router')
-
-    nuxt.options.vite.resolve = nuxt.options.vite.resolve || {}
-    nuxt.options.vite.resolve.dedupe = nuxt.options.vite.resolve.dedupe || []
-    nuxt.options.vite.resolve.dedupe.push('vue-router')
-
-    // Add router options template
-    addTemplate({
-      filename: 'router.options.mjs',
-      getContents: async () => {
-        // Scan and register app/router.options files
-        const routerOptionsFiles = (await Promise.all(nuxt.options._layers.map(
-          async layer => await findPath(resolve(layer.config.srcDir, 'app/router.options'))
-        ))).filter(Boolean) as string[]
-
-        // Add default options
-        routerOptionsFiles.push(resolve(runtimeDir, 'router.options'))
-
-        const configRouterOptions = genObjectFromRawEntries(Object.entries(nuxt.options.router.options)
-          .map(([key, value]) => [key, genString(value as string)]))
-
-        return [
-          ...routerOptionsFiles.map((file, index) => genImport(file, `routerOptions${index}`)),
-          `const configRouterOptions = ${configRouterOptions}`,
-          'export default {',
-          '...configRouterOptions,',
-          // We need to reverse spreading order to respect layers priority
-          ...routerOptionsFiles.map((_, index) => `...routerOptions${index},`).reverse(),
-          '}'
-        ].join('\n')
-      }
-    })
-
-    addTemplate({
-      filename: 'types/middleware.d.ts',
-      getContents: ({ app }: { app: NuxtApp }) => {
-        const composablesFile = resolve(runtimeDir, 'composables')
-        const namedMiddleware = app.middleware.filter(mw => !mw.global)
-        return [
-          'import type { NavigationGuard } from \'vue-router\'',
-          `export type MiddlewareKey = ${namedMiddleware.map(mw => genString(mw.name)).join(' | ') || 'string'}`,
-          `declare module ${genString(composablesFile)} {`,
-          '  interface PageMeta {',
-          '    middleware?: MiddlewareKey | NavigationGuard | Array<MiddlewareKey | NavigationGuard>',
-          '  }',
-          '}'
-        ].join('\n')
-      }
-    })
-
-    addTemplate({
-      filename: 'types/layouts.d.ts',
-      getContents: ({ app }: { app: NuxtApp }) => {
-        const composablesFile = resolve(runtimeDir, 'composables')
-        return [
-          'import { ComputedRef, Ref } from \'vue\'',
-          `export type LayoutKey = ${Object.keys(app.layouts).map(name => genString(name)).join(' | ') || 'string'}`,
-          `declare module ${genString(composablesFile)} {`,
-          '  interface PageMeta {',
-          '    layout?: false | LayoutKey | Ref<LayoutKey> | ComputedRef<LayoutKey>',
-          '  }',
-          '}'
-        ].join('\n')
-      }
-    })
-
-    // Add <NuxtPage>
-    addComponent({
-      name: 'NuxtPage',
-      priority: 10, // built-in that we do not expect the user to override
-      filePath: resolve(distDir, 'pages/runtime/page')
-    })
-
-    // Add declarations for middleware keys
-    nuxt.hook('prepare:types', ({ references }) => {
-      references.push({ path: resolve(nuxt.options.buildDir, 'types/middleware.d.ts') })
-      references.push({ path: resolve(nuxt.options.buildDir, 'types/layouts.d.ts') })
-    })
-  }
-})

From 628922324586588030dc50745c1fa675854cfba0 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 12 Apr 2023 16:35:11 +0200
Subject: [PATCH 03/52] feat: allow vite plugins to be prepended

---
 packages/kit/src/build.ts | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/packages/kit/src/build.ts b/packages/kit/src/build.ts
index e5678da2e6a7..e6c6ff073881 100644
--- a/packages/kit/src/build.ts
+++ b/packages/kit/src/build.ts
@@ -32,7 +32,14 @@ export interface ExtendConfigOptions {
 export interface ExtendWebpackConfigOptions extends ExtendConfigOptions {
 }
 
-export interface ExtendViteConfigOptions extends ExtendConfigOptions {}
+export interface ExtendViteConfigOptions extends ExtendConfigOptions {
+  /**
+   * Prepends the plugin to the array with `unshit()` instead of `push()`. In practice this shouldn't be necessary, but
+   * it's needed by unplugin-vue-router until vue exposes an API to parse files.
+   * @internal
+   */
+  prepend?: boolean
+}
 
 /**
  * Extend webpack config
@@ -119,11 +126,12 @@ export function addWebpackPlugin (plugin: WebpackPluginInstance | WebpackPluginI
  */
 export function addVitePlugin (plugin: VitePlugin | VitePlugin[], options?: ExtendViteConfigOptions) {
   extendViteConfig((config) => {
+    const method: 'push' | 'unshift' = options?.prepend ? 'unshift' : 'push'
     config.plugins = config.plugins || []
     if (Array.isArray(plugin)) {
-      config.plugins.push(...plugin)
+      config.plugins[method](...plugin)
     } else {
-      config.plugins.push(plugin)
+      config.plugins[method](plugin)
     }
   }, options)
 }

From 2f543251d778b4d933effbc56f638207218ba19a Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 12 Apr 2023 16:37:20 +0200
Subject: [PATCH 04/52] chore: add temporary playground to test

---
 packages/nuxt/package.json      |  1 +
 playground/app.vue              | 23 ++++++++++++++++++++---
 playground/nuxt.config.ts       | 19 ++++++++++++++++++-
 playground/pages/about.vue      |  6 ++++++
 playground/pages/index.vue      | 16 ++++++++++++++++
 playground/pages/users/[id].vue |  9 +++++++++
 6 files changed, 70 insertions(+), 4 deletions(-)
 create mode 100644 playground/pages/about.vue
 create mode 100644 playground/pages/index.vue
 create mode 100644 playground/pages/users/[id].vue

diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json
index c04ee9ad639e..153bba8c9daf 100644
--- a/packages/nuxt/package.json
+++ b/packages/nuxt/package.json
@@ -98,6 +98,7 @@
     "unenv": "^1.3.1",
     "unimport": "^3.0.6",
     "unplugin": "^1.3.1",
+    "unplugin-vue-router": "file:.yalc/unplugin-vue-router",
     "untyped": "^1.3.2",
     "vue": "^3.2.47",
     "vue-bundle-renderer": "^1.0.3",
diff --git a/playground/app.vue b/playground/app.vue
index 17d631007a1b..eb4bb3d735be 100644
--- a/playground/app.vue
+++ b/playground/app.vue
@@ -1,11 +1,28 @@
 <script setup lang="ts">
+// FIXME: remove these changes before merging
 </script>
 
 <template>
   <!-- Edit this file to play around with Nuxt but never commit changes! -->
-  <div>
-    Nuxt 3 Playground
-  </div>
+  <NuxtLink to="/">
+    Home
+  </NuxtLink>
+  |
+  <NuxtLink to="/about">
+    About
+  </NuxtLink>
+  |
+  <RouterLink to="/_new_extend">
+    Added in Nuxt Config
+  </RouterLink>
+  |
+  <RouterLink :to="{ name: '/users/[id]', params: { id: 5 } }">
+    Some User
+  </RouterLink>
+
+  <hr>
+
+  <NuxtPage />
 </template>
 
 <style scoped>
diff --git a/playground/nuxt.config.ts b/playground/nuxt.config.ts
index 896312f044ed..37c8695717d7 100644
--- a/playground/nuxt.config.ts
+++ b/playground/nuxt.config.ts
@@ -1,3 +1,20 @@
+import { resolve } from 'node:path'
+
 export default defineNuxtConfig({
+  experimental: {
+    typedPages: true,
+  },
 
-})
+  hooks: {
+    'pages:extend_legacy' (pages) {
+      console.log(`✅ Calling legacy pages:extend ${pages.length} pages`)
+      console.log(pages.map(page => page.fullPath))
+    },
+    'pages:beforeWrite' (rootPage) {
+      rootPage.insert('_new_extend', resolve('./pages/about.vue'))
+    },
+    'pages:extend' (page) {
+      console.log('⚙️ page', page.fullPath)
+    }
+  }
+});
diff --git a/playground/pages/about.vue b/playground/pages/about.vue
new file mode 100644
index 000000000000..72305e71016c
--- /dev/null
+++ b/playground/pages/about.vue
@@ -0,0 +1,6 @@
+<script lang="ts" setup>
+</script>
+
+<template>
+  <h1>about</h1>
+</template>
diff --git a/playground/pages/index.vue b/playground/pages/index.vue
new file mode 100644
index 000000000000..5325f8aaf7c6
--- /dev/null
+++ b/playground/pages/index.vue
@@ -0,0 +1,16 @@
+<script lang="ts" setup>
+import { definePage } from 'vue-router/auto'
+const route = useRoute('/')
+
+definePageMeta({
+  alias: '/home'
+})
+definePage({
+  // alias: '/casa'
+})
+</script>
+
+<template>
+  <h1>Index</h1>
+  <p>{{ route.params }}</p>
+</template>
diff --git a/playground/pages/users/[id].vue b/playground/pages/users/[id].vue
new file mode 100644
index 000000000000..a89b63f1a8ac
--- /dev/null
+++ b/playground/pages/users/[id].vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+const route = useRoute('/users/[id]')
+</script>
+
+<template>
+  <p>
+    user {{ route.params.id }}
+  </p>
+</template>

From 6ef6fd3fbf0d238c0f8ed46576d4956f485479ba Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 12 Apr 2023 16:42:41 +0200
Subject: [PATCH 05/52] style: lint

---
 packages/nuxt/src/core/nuxt.ts    |   2 +-
 packages/nuxt/src/pages/module.ts | 134 +++++++++++++++++++++++++-----
 playground/nuxt.config.ts         |   4 +-
 3 files changed, 116 insertions(+), 24 deletions(-)

diff --git a/packages/nuxt/src/core/nuxt.ts b/packages/nuxt/src/core/nuxt.ts
index 5c38493bafc8..27f56698869a 100644
--- a/packages/nuxt/src/core/nuxt.ts
+++ b/packages/nuxt/src/core/nuxt.ts
@@ -362,7 +362,7 @@ export async function loadNuxt (opts: LoadNuxtOptions): Promise<Nuxt> {
     pagesModule,
     metaModule,
     componentsModule
-  );
+  )
   options._modules.push([importsModule, {
     transform: {
       include: options._layers
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 8997954d9a03..37efb1296299 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -5,6 +5,19 @@ import { genImport, genObjectFromRawEntries, genString } from 'knitwork'
 import escapeRE from 'escape-string-regexp'
 import { joinURL } from 'ufo'
 import type { NuxtApp, NuxtPage } from 'nuxt/schema'
+import VueRouter from 'unplugin-vue-router/vite'
+import type {
+  EditableTreeNode,
+  Options as _UVROptions
+} from 'unplugin-vue-router'
+
+// TODO: conditional types extension
+// declare module '@nuxt/schema' {
+//   export interface NuxtHooks {
+//     'pages:_new_extend': (page: EditableTreeNode) => void;
+//     'pages:_beforeWrite': (rootPage: EditableTreeNode) => void;
+//   }
+// }
 
 import { distDir } from '../dirs'
 import { normalizeRoutes, resolvePagesRoutes } from './utils'
@@ -16,6 +29,8 @@ export default defineNuxtModule({
     name: 'pages'
   },
   setup (_options, nuxt) {
+    const useExperimentalTypedPages = nuxt.options.experimental.typedPages
+
     const pagesDirs = nuxt.options._layers.map(
       layer => resolve(layer.config.srcDir, layer.config.dir?.pages || 'pages')
     )
@@ -67,6 +82,33 @@ export default defineNuxtModule({
       return
     }
 
+    let rootPage: EditableTreeNode | undefined
+    if (useExperimentalTypedPages) {
+      console.log('📄 Adding pages module')
+
+      addVitePlugin(
+        VueRouter({
+          routesFolder: pagesDirs,
+          // FIXME: find the root of the project
+          dts: resolve(nuxt.options.srcDir, '.nuxt/typed-router.d.ts'),
+          logs: true,
+          extendRoute (route) {
+            // TODO: refactor names, add _legacy
+            return nuxt.callHook('pages:_new_extend', route)
+          },
+          async beforeWriteFiles (_rootPage) {
+            await nuxt.callHook('pages:_beforeWrite', _rootPage)
+            await nuxt.callHook('pages:extend', [..._rootPage])
+            rootPage = _rootPage
+          }
+        }),
+        {
+          prepend: true
+        }
+      )
+      // FIXME: add webpack plugin as well
+    }
+
     const runtimeDir = resolve(distDir, 'pages/runtime')
 
     // Add $router types
@@ -78,7 +120,7 @@ export default defineNuxtModule({
     nuxt.hook('imports:sources', (sources) => {
       const routerImports = sources.find(s => s.from === '#app' && s.imports.includes('onBeforeRouteLeave'))
       if (routerImports) {
-        routerImports.from = 'vue-router'
+        routerImports.from = useExperimentalTypedPages ? 'vue-router/auto' : 'vue-router'
       }
     })
 
@@ -91,6 +133,7 @@ export default defineNuxtModule({
       ].filter(Boolean)
 
       const pathPattern = new RegExp(`(^|\\/)(${dirs.map(escapeRE).join('|')})/`)
+      // TODO: can we remove this since the template is now just a re-export?
       if (event !== 'change' && path.match(pathPattern)) {
         await updateTemplates({
           filter: template => template.filename === 'routes.mjs'
@@ -114,21 +157,43 @@ export default defineNuxtModule({
     if (!nuxt.options.dev && nuxt.options._generate) {
       const prerenderRoutes = new Set<string>()
       nuxt.hook('modules:done', () => {
-        nuxt.hook('pages:extend', (pages) => {
+        // TODO: this should be doable within the unplugin
+        if (useExperimentalTypedPages) {
           prerenderRoutes.clear()
-          const processPages = (pages: NuxtPage[], currentPath = '/') => {
-            for (const page of pages) {
-              // Add root of optional dynamic paths and catchalls
-              if (page.path.match(/^\/?:.*(\?|\(\.\*\)\*)$/) && !page.children?.length) { prerenderRoutes.add(currentPath) }
-              // Skip dynamic paths
-              if (page.path.includes(':')) { continue }
-              const route = joinURL(currentPath, page.path)
-              prerenderRoutes.add(route)
-              if (page.children) { processPages(page.children, route) }
+          if (!rootPage) {
+            // FIXME:
+            throw new Error('Can this ever happen?')
+          }
+
+          // FIXME: this requires some code on the unplugin side
+          for (const page of rootPage) {
+            // if page has no children (is leaf) and has an optional param or a catch all param at the end, add
+            if (!page.isPassThrough &&
+              // does it no required params
+              !page.params.some(p => !p.optional)
+              // && any optional param is located at the end
+            ) {
+              prerenderRoutes.add(page.fullPath)
             }
           }
-          processPages(pages)
-        })
+        } else {
+          // Legacy pages:extend
+          nuxt.hook('pages:extend', (pages) => {
+            prerenderRoutes.clear()
+            const processPages = (pages: NuxtPage[], currentPath = '/') => {
+              for (const page of pages) {
+                // Add root of optional dynamic paths and catchalls
+                if (page.path.match(/^\/?:.*(\?|\(\.\*\)\*)$/) && !page.children?.length) { prerenderRoutes.add(currentPath) }
+                // Skip dynamic paths
+                if (page.path.includes(':')) { continue }
+                const route = joinURL(currentPath, page.path)
+                prerenderRoutes.add(route)
+                if (page.children) { processPages(page.children, route) }
+              }
+            }
+            processPages(pages)
+          })
+        }
       })
       nuxt.hook('nitro:build:before', (nitro) => {
         for (const route of nitro.options.prerender.routes || []) {
@@ -144,7 +209,11 @@ export default defineNuxtModule({
     nuxt.hook('imports:extend', (imports) => {
       imports.push(
         { name: 'definePageMeta', as: 'definePageMeta', from: resolve(runtimeDir, 'composables') },
-        { name: 'useLink', as: 'useLink', from: 'vue-router' }
+        {
+          name: 'useLink',
+          as: 'useLink',
+          from: useExperimentalTypedPages ? 'vue-router/auto' : 'vue-router'
+        }
       )
     })
 
@@ -157,6 +226,7 @@ export default defineNuxtModule({
       )
     }
     nuxt.hook('modules:done', () => {
+      // TODO: fix broken definePageMeta() with unplugin-vue-router
       addVitePlugin(PageMetaPlugin.vite(pageMetaOptions))
       addWebpackPlugin(PageMetaPlugin.webpack(pageMetaOptions))
     })
@@ -176,10 +246,25 @@ export default defineNuxtModule({
     // Do not prefetch page chunks
     nuxt.hook('build:manifest', async (manifest) => {
       if (nuxt.options.dev) { return }
-      const pages = await resolvePagesRoutes()
-      await nuxt.callHook('pages:extend', pages)
+      console.log('👉 build:manifest')
+      // const pages = await resolvePagesRoutes()
+      // await nuxt.callHook('pages:extend', pages)
+
+      // TODO: do we need the paths to be relative or can they be absolute?
+      // NOTE: they used to be relative to the project root
+      let sourceFiles: string[]
+      sourceFiles = [...(rootPage || [])]
+        .map(p => p.components.get('default'))
+        .filter((v: unknown): v is string => !!v)
+        .map(p => relative(nuxt.options.srcDir, p))
+
+      // unplugin-vue-router already generates the routes before this hook
+      if (!useExperimentalTypedPages) {
+        const pages = await resolvePagesRoutes()
+        await nuxt.callHook('pages:extend', pages)
+        sourceFiles = getSources(pages)
+      }
 
-      const sourceFiles = getSources(pages)
       for (const key in manifest) {
         if (manifest[key].isEntry) {
           manifest[key].dynamicImports =
@@ -192,10 +277,15 @@ export default defineNuxtModule({
     addTemplate({
       filename: 'routes.mjs',
       async getContents () {
-        const pages = await resolvePagesRoutes()
-        await nuxt.callHook('pages:extend', pages)
-        const { routes, imports } = normalizeRoutes(pages)
-        return [...imports, `export default ${routes}`].join('\n')
+        if (useExperimentalTypedPages) {
+          console.log('👉 routes.mjs')
+          return "export { routes as default } from 'vue-router/auto/routes';"
+        } else {
+          const pages = await resolvePagesRoutes()
+          await nuxt.callHook('pages:extend', pages)
+          const { routes, imports } = normalizeRoutes(pages)
+          return [...imports, `export default ${routes}`].join('\n')
+        }
       }
     })
 
@@ -214,6 +304,8 @@ export default defineNuxtModule({
     nuxt.options.vite.resolve.dedupe = nuxt.options.vite.resolve.dedupe || []
     nuxt.options.vite.resolve.dedupe.push('vue-router')
 
+    // TODO: Do we need to provide a fallback for this? Or can we just expose
+    // `router.options` from the router instance itself
     // Add router options template
     addTemplate({
       filename: 'router.options.mjs',
diff --git a/playground/nuxt.config.ts b/playground/nuxt.config.ts
index 37c8695717d7..98cf67072ba2 100644
--- a/playground/nuxt.config.ts
+++ b/playground/nuxt.config.ts
@@ -2,7 +2,7 @@ import { resolve } from 'node:path'
 
 export default defineNuxtConfig({
   experimental: {
-    typedPages: true,
+    typedPages: true
   },
 
   hooks: {
@@ -17,4 +17,4 @@ export default defineNuxtConfig({
       console.log('⚙️ page', page.fullPath)
     }
   }
-});
+})

From bd79b916f924a4cded5a3ddbc8855d22ed9f281f Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 12 Apr 2023 17:06:43 +0200
Subject: [PATCH 06/52] refactor: add router plugin

---
 packages/nuxt/src/pages/module.ts             |   9 +-
 .../src/pages/runtime/plugins/router-base.ts  | 205 +++++++++++++++++
 .../src/pages/runtime/plugins/router-typed.ts |   9 +
 .../nuxt/src/pages/runtime/plugins/router.ts  | 211 +-----------------
 4 files changed, 232 insertions(+), 202 deletions(-)
 create mode 100644 packages/nuxt/src/pages/runtime/plugins/router-base.ts
 create mode 100644 packages/nuxt/src/pages/runtime/plugins/router-typed.ts

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 37efb1296299..61ff6d33b0de 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -69,7 +69,14 @@ export default defineNuxtModule({
     })
 
     if (!nuxt.options.pages) {
-      addPlugin(resolve(distDir, 'app/plugins/router'))
+      addPlugin(
+        resolve(
+          distDir,
+          useExperimentalTypedPages
+            ? 'app/plugins/router-typed'
+            : 'app/plugins/router'
+        )
+      )
       addTemplate({
         filename: 'pages.mjs',
         getContents: () => 'export { useRoute } from \'#app\''
diff --git a/packages/nuxt/src/pages/runtime/plugins/router-base.ts b/packages/nuxt/src/pages/runtime/plugins/router-base.ts
new file mode 100644
index 000000000000..4cc428b1e6e9
--- /dev/null
+++ b/packages/nuxt/src/pages/runtime/plugins/router-base.ts
@@ -0,0 +1,205 @@
+import { computed, isReadonly, reactive, shallowRef } from 'vue'
+import type { Ref } from 'vue'
+import type { RouteLocation, RouteRecordRaw, Router, RouterHistory, RouterOptions } from 'vue-router'
+import {
+  createMemoryHistory,
+  createWebHashHistory,
+  createWebHistory
+} from 'vue-router'
+import { createError } from 'h3'
+import { isEqual, withoutBase } from 'ufo'
+
+import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
+import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'
+import { clearError, showError, useError } from '#app/composables/error'
+import { useRequestEvent } from '#app/composables/ssr'
+import { useState } from '#app/composables/state'
+import { navigateTo } from '#app/composables/router'
+
+// @ts-ignore
+import routerOptions from '#build/router.options'
+// @ts-ignore
+import { globalMiddleware, namedMiddleware } from '#build/middleware'
+
+// https://github.com/vuejs/router/blob/4a0cc8b9c1e642cdf47cc007fa5bbebde70afc66/packages/router/src/history/html5.ts#L37
+function createCurrentLocation (
+  base: string,
+  location: Location
+): string {
+  const { pathname, search, hash } = location
+  // allows hash bases like #, /#, #/, #!, #!/, /#!/, or even /folder#end
+  const hashPos = base.indexOf('#')
+  if (hashPos > -1) {
+    const slicePos = hash.includes(base.slice(hashPos))
+      ? base.slice(hashPos).length
+      : 1
+    let pathFromHash = hash.slice(slicePos)
+    // prepend the starting slash to hash so the url starts with /#
+    if (pathFromHash[0] !== '/') { pathFromHash = '/' + pathFromHash }
+    return withoutBase(pathFromHash, '')
+  }
+  const path = withoutBase(pathname, base)
+  return path + search + hash
+}
+
+interface RouterFactory {
+  (
+    history: RouterHistory,
+    routerOptions: RouterOptions & { routes?: (routes: RouteRecordRaw[]) => RouteRecordRaw[]}
+  ): Router;
+}
+
+export function createRouterPlugin (routerFactory: RouterFactory) {
+  return defineNuxtPlugin({
+    name: 'nuxt:router',
+    enforce: 'pre',
+    async setup (nuxtApp) {
+      let routerBase = useRuntimeConfig().app.baseURL
+      if (routerOptions.hashMode && !routerBase.includes('#')) {
+        // allow the user to provide a `#` in the middle: `/base/#/app`
+        routerBase += '#'
+      }
+
+      const history = routerOptions.history?.(routerBase) ?? (process.client
+        ? (routerOptions.hashMode ? createWebHashHistory(routerBase) : createWebHistory(routerBase))
+        : createMemoryHistory(routerBase)
+      )
+
+      const initialURL = process.server ? nuxtApp.ssrContext!.url : createCurrentLocation(routerBase, window.location)
+      const router = routerFactory(history, routerOptions)
+      nuxtApp.vueApp.use(router)
+
+      const previousRoute = shallowRef(router.currentRoute.value)
+      router.afterEach((_to, from) => {
+        previousRoute.value = from
+      })
+
+      Object.defineProperty(nuxtApp.vueApp.config.globalProperties, 'previousRoute', {
+        get: () => previousRoute.value
+      })
+
+      // Allows suspending the route object until page navigation completes
+      const _route = shallowRef(router.resolve(initialURL) as RouteLocation)
+      const syncCurrentRoute = () => { _route.value = router.currentRoute.value }
+      nuxtApp.hook('page:finish', syncCurrentRoute)
+      router.afterEach((to, from) => {
+        // We won't trigger suspense if the component is reused between routes
+        // so we need to update the route manually
+        if (to.matched[0]?.components?.default === from.matched[0]?.components?.default) {
+          syncCurrentRoute()
+        }
+      })
+
+      // https://github.com/vuejs/router/blob/main/packages/router/src/router.ts#L1225-L1233
+      const route = {} as RouteLocation
+      for (const key in _route.value) {
+        (route as any)[key] = computed(() => _route.value[key as keyof RouteLocation])
+      }
+
+      nuxtApp._route = reactive(route)
+
+      nuxtApp._middleware = nuxtApp._middleware || {
+        global: [],
+        named: {}
+      }
+
+      const error = useError()
+
+      try {
+        if (process.server) {
+          await router.push(initialURL)
+        }
+
+        await router.isReady()
+      } catch (error: any) {
+        // We'll catch 404s here
+        await callWithNuxt(nuxtApp, showError, [error])
+      }
+
+      const initialLayout = useState('_layout')
+      router.beforeEach(async (to, from) => {
+        to.meta = reactive(to.meta)
+        if (nuxtApp.isHydrating && initialLayout.value && !isReadonly(to.meta.layout)) {
+          to.meta.layout = initialLayout.value as Exclude<PageMeta['layout'], Ref | false>
+        }
+        nuxtApp._processingMiddleware = true
+
+        type MiddlewareDef = string | RouteMiddleware
+        const middlewareEntries = new Set<MiddlewareDef>([...globalMiddleware, ...nuxtApp._middleware.global])
+        for (const component of to.matched) {
+          const componentMiddleware = component.meta.middleware as MiddlewareDef | MiddlewareDef[]
+          if (!componentMiddleware) { continue }
+          if (Array.isArray(componentMiddleware)) {
+            for (const entry of componentMiddleware) {
+              middlewareEntries.add(entry)
+            }
+          } else {
+            middlewareEntries.add(componentMiddleware)
+          }
+        }
+
+        for (const entry of middlewareEntries) {
+          const middleware = typeof entry === 'string' ? nuxtApp._middleware.named[entry] || await namedMiddleware[entry]?.().then((r: any) => r.default || r) : entry
+
+          if (!middleware) {
+            if (process.dev) {
+              throw new Error(`Unknown route middleware: '${entry}'. Valid middleware: ${Object.keys(namedMiddleware).map(mw => `'${mw}'`).join(', ')}.`)
+            }
+            throw new Error(`Unknown route middleware: '${entry}'.`)
+          }
+
+          const result = await callWithNuxt(nuxtApp, middleware, [to, from])
+          if (process.server || (!nuxtApp.payload.serverRendered && nuxtApp.isHydrating)) {
+            if (result === false || result instanceof Error) {
+              const error = result || createError({
+                statusCode: 404,
+                statusMessage: `Page Not Found: ${initialURL}`
+              })
+              await callWithNuxt(nuxtApp, showError, [error])
+              return false
+            }
+          }
+          if (result || result === false) { return result }
+        }
+      })
+
+      router.afterEach(async (to) => {
+        delete nuxtApp._processingMiddleware
+
+        if (process.client && !nuxtApp.isHydrating && error.value) {
+          // Clear any existing errors
+          await callWithNuxt(nuxtApp, clearError)
+        }
+        if (to.matched.length === 0) {
+          await callWithNuxt(nuxtApp, showError, [createError({
+            statusCode: 404,
+            fatal: false,
+            statusMessage: `Page not found: ${to.fullPath}`
+          })])
+        } else if (process.server) {
+          const currentURL = to.fullPath || '/'
+          if (!isEqual(currentURL, initialURL, { trailingSlash: true })) {
+            const event = await callWithNuxt(nuxtApp, useRequestEvent)
+            const options = { redirectCode: event.node.res.statusCode !== 200 ? event.node.res.statusCode || 302 : 302 }
+            await callWithNuxt(nuxtApp, navigateTo, [currentURL, options])
+          }
+        }
+      })
+
+      nuxtApp.hooks.hookOnce('app:created', async () => {
+        try {
+          await router.replace({
+            ...router.resolve(initialURL),
+            name: undefined, // #4920, #$4982
+            force: true
+          })
+        } catch (error: any) {
+          // We'll catch middleware errors or deliberate exceptions here
+          await callWithNuxt(nuxtApp, showError, [error])
+        }
+      })
+
+      return { provide: { router } }
+    }
+  }) as Plugin<{ router: Router }>
+}
diff --git a/packages/nuxt/src/pages/runtime/plugins/router-typed.ts b/packages/nuxt/src/pages/runtime/plugins/router-typed.ts
new file mode 100644
index 000000000000..16f53a373005
--- /dev/null
+++ b/packages/nuxt/src/pages/runtime/plugins/router-typed.ts
@@ -0,0 +1,9 @@
+import { createRouter } from 'vue-router/auto'
+import { createRouterPlugin } from './router-base'
+
+export default createRouterPlugin((history, routerOptions) => {
+  return createRouter({
+    ...routerOptions,
+    history
+  })
+})
diff --git a/packages/nuxt/src/pages/runtime/plugins/router.ts b/packages/nuxt/src/pages/runtime/plugins/router.ts
index 5e485531541b..cd10a961d7f8 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router.ts
@@ -1,205 +1,14 @@
-import { computed, isReadonly, reactive, shallowRef } from 'vue'
-import type { Ref } from 'vue'
-import type { RouteLocation, Router } from 'vue-router'
-import {
-  createMemoryHistory,
-  createRouter,
-  createWebHashHistory,
-  createWebHistory
-} from 'vue-router'
-import { createError } from 'h3'
-import { isEqual, withoutBase } from 'ufo'
-
-import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
-import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'
-import { clearError, showError, useError } from '#app/composables/error'
-import { useRequestEvent } from '#app/composables/ssr'
-import { useState } from '#app/composables/state'
-import { navigateTo } from '#app/composables/router'
+import { createRouter } from 'vue-router'
+import { createRouterPlugin } from './router-base'
 
 // @ts-ignore
 import _routes from '#build/routes'
-// @ts-ignore
-import routerOptions from '#build/router.options'
-// @ts-ignore
-import { globalMiddleware, namedMiddleware } from '#build/middleware'
-
-// https://github.com/vuejs/router/blob/4a0cc8b9c1e642cdf47cc007fa5bbebde70afc66/packages/router/src/history/html5.ts#L37
-function createCurrentLocation (
-  base: string,
-  location: Location
-): string {
-  const { pathname, search, hash } = location
-  // allows hash bases like #, /#, #/, #!, #!/, /#!/, or even /folder#end
-  const hashPos = base.indexOf('#')
-  if (hashPos > -1) {
-    const slicePos = hash.includes(base.slice(hashPos))
-      ? base.slice(hashPos).length
-      : 1
-    let pathFromHash = hash.slice(slicePos)
-    // prepend the starting slash to hash so the url starts with /#
-    if (pathFromHash[0] !== '/') { pathFromHash = '/' + pathFromHash }
-    return withoutBase(pathFromHash, '')
-  }
-  const path = withoutBase(pathname, base)
-  return path + search + hash
-}
-
-export default defineNuxtPlugin({
-  name: 'nuxt:router',
-  enforce: 'pre',
-  async setup (nuxtApp) {
-    let routerBase = useRuntimeConfig().app.baseURL
-    if (routerOptions.hashMode && !routerBase.includes('#')) {
-      // allow the user to provide a `#` in the middle: `/base/#/app`
-      routerBase += '#'
-    }
-
-    const history = routerOptions.history?.(routerBase) ?? (process.client
-      ? (routerOptions.hashMode ? createWebHashHistory(routerBase) : createWebHistory(routerBase))
-      : createMemoryHistory(routerBase)
-    )
-
-    const routes = routerOptions.routes?.(_routes) ?? _routes
-
-    const initialURL = process.server ? nuxtApp.ssrContext!.url : createCurrentLocation(routerBase, window.location)
-    const router = createRouter({
-      ...routerOptions,
-      history,
-      routes
-    })
-    nuxtApp.vueApp.use(router)
-
-    const previousRoute = shallowRef(router.currentRoute.value)
-    router.afterEach((_to, from) => {
-      previousRoute.value = from
-    })
-
-    Object.defineProperty(nuxtApp.vueApp.config.globalProperties, 'previousRoute', {
-      get: () => previousRoute.value
-    })
-
-    // Allows suspending the route object until page navigation completes
-    const _route = shallowRef(router.resolve(initialURL) as RouteLocation)
-    const syncCurrentRoute = () => { _route.value = router.currentRoute.value }
-    nuxtApp.hook('page:finish', syncCurrentRoute)
-    router.afterEach((to, from) => {
-      // We won't trigger suspense if the component is reused between routes
-      // so we need to update the route manually
-      if (to.matched[0]?.components?.default === from.matched[0]?.components?.default) {
-        syncCurrentRoute()
-      }
-    })
-
-    // https://github.com/vuejs/router/blob/main/packages/router/src/router.ts#L1225-L1233
-    const route = {} as RouteLocation
-    for (const key in _route.value) {
-      (route as any)[key] = computed(() => _route.value[key as keyof RouteLocation])
-    }
-
-    nuxtApp._route = reactive(route)
-
-    nuxtApp._middleware = nuxtApp._middleware || {
-      global: [],
-      named: {}
-    }
-
-    const error = useError()
-
-    try {
-      if (process.server) {
-        await router.push(initialURL)
-      }
-
-      await router.isReady()
-    } catch (error: any) {
-      // We'll catch 404s here
-      await callWithNuxt(nuxtApp, showError, [error])
-    }
-
-    const initialLayout = useState('_layout')
-    router.beforeEach(async (to, from) => {
-      to.meta = reactive(to.meta)
-      if (nuxtApp.isHydrating && initialLayout.value && !isReadonly(to.meta.layout)) {
-        to.meta.layout = initialLayout.value as Exclude<PageMeta['layout'], Ref | false>
-      }
-      nuxtApp._processingMiddleware = true
-
-      type MiddlewareDef = string | RouteMiddleware
-      const middlewareEntries = new Set<MiddlewareDef>([...globalMiddleware, ...nuxtApp._middleware.global])
-      for (const component of to.matched) {
-        const componentMiddleware = component.meta.middleware as MiddlewareDef | MiddlewareDef[]
-        if (!componentMiddleware) { continue }
-        if (Array.isArray(componentMiddleware)) {
-          for (const entry of componentMiddleware) {
-            middlewareEntries.add(entry)
-          }
-        } else {
-          middlewareEntries.add(componentMiddleware)
-        }
-      }
-
-      for (const entry of middlewareEntries) {
-        const middleware = typeof entry === 'string' ? nuxtApp._middleware.named[entry] || await namedMiddleware[entry]?.().then((r: any) => r.default || r) : entry
-
-        if (!middleware) {
-          if (process.dev) {
-            throw new Error(`Unknown route middleware: '${entry}'. Valid middleware: ${Object.keys(namedMiddleware).map(mw => `'${mw}'`).join(', ')}.`)
-          }
-          throw new Error(`Unknown route middleware: '${entry}'.`)
-        }
-
-        const result = await callWithNuxt(nuxtApp, middleware, [to, from])
-        if (process.server || (!nuxtApp.payload.serverRendered && nuxtApp.isHydrating)) {
-          if (result === false || result instanceof Error) {
-            const error = result || createError({
-              statusCode: 404,
-              statusMessage: `Page Not Found: ${initialURL}`
-            })
-            await callWithNuxt(nuxtApp, showError, [error])
-            return false
-          }
-        }
-        if (result || result === false) { return result }
-      }
-    })
-
-    router.afterEach(async (to) => {
-      delete nuxtApp._processingMiddleware
-
-      if (process.client && !nuxtApp.isHydrating && error.value) {
-        // Clear any existing errors
-        await callWithNuxt(nuxtApp, clearError)
-      }
-      if (to.matched.length === 0) {
-        await callWithNuxt(nuxtApp, showError, [createError({
-          statusCode: 404,
-          fatal: false,
-          statusMessage: `Page not found: ${to.fullPath}`
-        })])
-      } else if (process.server) {
-        const currentURL = to.fullPath || '/'
-        if (!isEqual(currentURL, initialURL, { trailingSlash: true })) {
-          const event = await callWithNuxt(nuxtApp, useRequestEvent)
-          const options = { redirectCode: event.node.res.statusCode !== 200 ? event.node.res.statusCode || 302 : 302 }
-          await callWithNuxt(nuxtApp, navigateTo, [currentURL, options])
-        }
-      }
-    })
-
-    nuxtApp.hooks.hookOnce('app:created', async () => {
-      try {
-        await router.replace({
-          ...router.resolve(initialURL),
-          name: undefined, // #4920, #$4982
-          force: true
-        })
-      } catch (error: any) {
-        // We'll catch middleware errors or deliberate exceptions here
-        await callWithNuxt(nuxtApp, showError, [error])
-      }
-    })
 
-    return { provide: { router } }
-  }
-}) as Plugin<{ router: Router }>
+export default createRouterPlugin((history, routerOptions) => {
+  const routes = routerOptions.routes?.(_routes) ?? _routes
+  return createRouter({
+    ...routerOptions,
+    history,
+    routes
+  })
+})

From 2622b064312ff227636d765e0c4ac34c723729a0 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 12 Apr 2023 17:11:06 +0200
Subject: [PATCH 07/52] feat: add types for unplugin-vue-router

---
 packages/nuxi/src/utils/prepare.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nuxi/src/utils/prepare.ts b/packages/nuxi/src/utils/prepare.ts
index 9a72c56d154e..e83a0a429f3d 100644
--- a/packages/nuxi/src/utils/prepare.ts
+++ b/packages/nuxi/src/utils/prepare.ts
@@ -30,7 +30,7 @@ export const writeTypes = async (nuxt: Nuxt) => {
       join(relative(nuxt.options.buildDir, nuxt.options.rootDir), '**/*'),
       ...nuxt.options.srcDir !== nuxt.options.rootDir ? [join(relative(nuxt.options.buildDir, nuxt.options.srcDir), '**/*')] : [],
       ...nuxt.options.typescript.includeWorkspace && nuxt.options.workspaceDir !== nuxt.options.rootDir ? [join(relative(nuxt.options.buildDir, nuxt.options.workspaceDir), '**/*')] : []
-    ],
+    ].concat(nuxt.options.experimental.typedPages ? './typed-router.d.ts' : []),
     exclude: [
       // nitro generate output: https://github.com/nuxt/nuxt/blob/main/packages/nuxt/src/core/nitro.ts#L186
       relative(nuxt.options.buildDir, resolve(nuxt.options.rootDir, 'dist'))

From 4d8c1e1243de3e27f7c41a806fd707a4c456b6a1 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 12 Apr 2023 17:12:23 +0200
Subject: [PATCH 08/52] wip: editable page

---
 packages/nuxt/src/pages/EditableRoute.ts | 105 +++++++++++++++++++++++
 1 file changed, 105 insertions(+)
 create mode 100644 packages/nuxt/src/pages/EditableRoute.ts

diff --git a/packages/nuxt/src/pages/EditableRoute.ts b/packages/nuxt/src/pages/EditableRoute.ts
new file mode 100644
index 000000000000..47fb8e74ec8b
--- /dev/null
+++ b/packages/nuxt/src/pages/EditableRoute.ts
@@ -0,0 +1,105 @@
+import type { NuxtPage } from '@nuxt/schema'
+import type { EditableTreeNode } from 'unplugin-vue-router'
+
+/**
+ * TODO: after checking https://github.dev/intlify/routing we need to ensure that a module author can set the children of a route with the following properties:
+  - name?: string
+  - path: string
+  - file?: string // for nuxt bridge & nuxt 3
+  - children?: Route[]
+ */
+
+export class NuxtPageEditable {
+  private _node: EditableTreeNode
+  private _children: NuxtPage[]
+
+  constructor (node: EditableTreeNode) {
+    this._node = node
+    this._children = createChildrenProxy(node)
+  }
+
+  get name () {
+    return this._node.name
+  }
+
+  set name (name: string) {
+    this._node.name = name
+  }
+
+  // TODO: is it fullPath or path?
+  get path () {
+    return this._node.path
+  }
+
+  // TODO: is it fullPath or path?
+  set path (path: string) {
+    this._node.path = path
+  }
+
+  get file () {
+    return this._node.components.get('default')
+  }
+
+  set file (file: string | undefined) {
+    if (!file) {
+      this._node.components.delete('default')
+    } else {
+      this._node.components.set('default', file)
+    }
+  }
+
+  // FIXME: I need to create a proxy on children array to work with splice and other functions
+
+  get children (): NuxtPage[] {
+    return this._children
+  }
+
+  set children (routes: NuxtPage[]) {
+    // TODO: remove all children then add the new ones
+    throw new Error('Not implemented')
+  }
+}
+
+function createChildrenProxy (node: EditableTreeNode): NuxtPage[] {
+  const target: NuxtPage[] = node.children.map(n => new NuxtPageEditable(n))
+
+  console.log('🪄 proxified')
+  const self = new Proxy<NuxtPage[]>(target, {
+    get (target, p, receiver) {
+      if (p === 'push') {
+        function push (target: NuxtPage[], ...routes: NuxtPage[]) {
+          console.log('🪄 push()', routes)
+          routes.forEach((route) => {
+            const routeNode = node.insert(route.path, route.path)
+            const nuxtPage = new NuxtPageEditable(routeNode)
+            routeNode.name = route.name
+            // FIXME: add once made writable
+            // routeNode.alias = route.alias
+            if (route.meta) {
+              routeNode.addToMeta(route.meta)
+            }
+            // FIXME: implement
+            // routeNode.redirect = route.redirect
+            // .... others
+            if (route.file) {
+              console.log('🪄 set file', route.file)
+              routeNode.components.set('default', route.file)
+            }
+            route.children?.forEach((child) => {
+              // FIXME:
+              push(nuxtPage.children, child)
+            })
+
+            return target.push(nuxtPage)
+          })
+        }
+
+        return push.bind(null, target)
+      }
+
+      return Reflect.get(target, p, receiver)
+    }
+  })
+
+  return self
+}

From 6aa00e04b8ad9e30b28431d42a005d618e2d56f5 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Tue, 18 Apr 2023 17:25:19 +0200
Subject: [PATCH 09/52] refactor: add #build/vue-router

---
 packages/nuxt/src/app/components/layout.ts    |  4 +-
 packages/nuxt/src/app/components/nuxt-link.ts |  2 +-
 packages/nuxt/src/app/composables/preload.ts  |  2 +-
 packages/nuxt/src/app/composables/router.ts   |  6 +--
 packages/nuxt/src/app/nuxt.ts                 |  2 +-
 packages/nuxt/src/build-vue-router.d.ts       |  8 +++
 packages/nuxt/src/pages/module.ts             | 54 ++++++++++++++++---
 .../nuxt/src/pages/runtime/composables.ts     |  2 +-
 packages/nuxt/src/pages/runtime/page.ts       |  4 +-
 .../src/pages/runtime/plugins/router-base.ts  | 18 ++++---
 .../nuxt/src/pages/runtime/plugins/router.ts  |  2 +-
 .../nuxt/src/pages/runtime/router.options.ts  |  2 +-
 packages/nuxt/src/pages/runtime/utils.ts      |  2 +-
 playground/pages/index.vue                    |  7 ++-
 14 files changed, 86 insertions(+), 29 deletions(-)
 create mode 100644 packages/nuxt/src/build-vue-router.d.ts

diff --git a/packages/nuxt/src/app/components/layout.ts b/packages/nuxt/src/app/components/layout.ts
index 13fbeb923b76..efe0d6f9434a 100644
--- a/packages/nuxt/src/app/components/layout.ts
+++ b/packages/nuxt/src/app/components/layout.ts
@@ -1,8 +1,8 @@
 import type { Ref, VNode } from 'vue'
 import { Transition, computed, defineComponent, h, inject, nextTick, onMounted, unref } from 'vue'
-import type { RouteLocationNormalizedLoaded } from 'vue-router'
 import { _wrapIf } from './utils'
-import { useRoute } from '#app/composables/router'
+import type { RouteLocationNormalizedLoaded } from '#build/vue-router'
+import { useRoute } from '~/../packages/nuxt/src/app/composables'
 // @ts-ignore
 import { useRoute as useVueRouterRoute } from '#build/pages'
 // @ts-ignore
diff --git a/packages/nuxt/src/app/components/nuxt-link.ts b/packages/nuxt/src/app/components/nuxt-link.ts
index 32b572ae5d3d..6674fc1014e7 100644
--- a/packages/nuxt/src/app/components/nuxt-link.ts
+++ b/packages/nuxt/src/app/components/nuxt-link.ts
@@ -1,6 +1,5 @@
 import type { ComputedRef, DefineComponent, PropType } from 'vue'
 import { computed, defineComponent, h, onBeforeUnmount, onMounted, ref, resolveComponent } from 'vue'
-import type { RouteLocation, RouteLocationRaw } from 'vue-router'
 import { hasProtocol, parseQuery, parseURL, withTrailingSlash, withoutTrailingSlash } from 'ufo'
 
 import { preloadRouteComponents } from '../composables/preload'
@@ -8,6 +7,7 @@ import { onNuxtReady } from '../composables/ready'
 import { navigateTo, useRouter } from '../composables/router'
 import { useNuxtApp } from '../nuxt'
 import { cancelIdleCallback, requestIdleCallback } from '../compat/idle-callback'
+import type { RouteLocation, RouteLocationRaw } from '#build/vue-router'
 
 const firstNonUndefined = <T> (...args: (T | undefined)[]) => args.find(arg => arg !== undefined)
 
diff --git a/packages/nuxt/src/app/composables/preload.ts b/packages/nuxt/src/app/composables/preload.ts
index 3844c9d0c008..e29108d8b733 100644
--- a/packages/nuxt/src/app/composables/preload.ts
+++ b/packages/nuxt/src/app/composables/preload.ts
@@ -1,7 +1,7 @@
 import type { Component } from 'vue'
-import type { RouteLocationRaw, Router } from 'vue-router'
 import { useNuxtApp } from '../nuxt'
 import { useRouter } from './router'
+import type { RouteLocationRaw, Router } from '#build/vue-router'
 
 /**
  * Preload a component or components that have been globally registered.
diff --git a/packages/nuxt/src/app/composables/router.ts b/packages/nuxt/src/app/composables/router.ts
index b73f31b20363..dc4a6a935f6c 100644
--- a/packages/nuxt/src/app/composables/router.ts
+++ b/packages/nuxt/src/app/composables/router.ts
@@ -1,6 +1,5 @@
 import { getCurrentInstance, inject, onUnmounted } from 'vue'
 import type { Ref } from 'vue'
-import type { NavigationFailure, NavigationGuard, RouteLocationNormalized, RouteLocationNormalizedLoaded, RouteLocationPathRaw, RouteLocationRaw, Router } from 'vue-router'
 import { sendRedirect } from 'h3'
 import { hasProtocol, joinURL, parseURL } from 'ufo'
 
@@ -9,14 +8,15 @@ import type { NuxtError } from './error'
 import { createError } from './error'
 import { useState } from './state'
 import { setResponseStatus } from './ssr'
+import type { NavigationFailure, NavigationGuard, RouteLocationNormalized, RouteLocationPathRaw, RouteLocationRaw, Router, useRoute as _useRoute, useRouter as _useRouter } from '#build/vue-router'
 
 import type { PageMeta } from '#app'
 
-export const useRouter = () => {
+export const useRouter: typeof _useRouter = () => {
   return useNuxtApp()?.$router as Router
 }
 
-export const useRoute = (): RouteLocationNormalizedLoaded => {
+export const useRoute: typeof _useRoute = () => {
   if (process.dev && isProcessingMiddleware()) {
     console.warn('[nuxt] Calling `useRoute` within middleware may lead to misleading results. Instead, use the (to, from) arguments passed to the middleware to access the new and old routes.')
   }
diff --git a/packages/nuxt/src/app/nuxt.ts b/packages/nuxt/src/app/nuxt.ts
index eb4d218f0db5..47c9288ad5f4 100644
--- a/packages/nuxt/src/app/nuxt.ts
+++ b/packages/nuxt/src/app/nuxt.ts
@@ -1,7 +1,6 @@
 /* eslint-disable no-use-before-define */
 import { getCurrentInstance, reactive } from 'vue'
 import type { App, Ref, VNode, onErrorCaptured } from 'vue'
-import type { RouteLocationNormalizedLoaded } from 'vue-router'
 import type { HookCallback, Hookable } from 'hookable'
 import { createHooks } from 'hookable'
 import { getContext } from 'unctx'
@@ -13,6 +12,7 @@ import type { AppConfig, AppConfigInput, RuntimeConfig } from 'nuxt/schema'
 import type { NuxtIslandContext } from '../core/runtime/nitro/renderer'
 import type { RouteMiddleware } from '../../app'
 import type { NuxtError } from '../app/composables/error'
+import type { RouteLocationNormalizedLoaded } from '#build/vue-router'
 
 const nuxtAppCtx = /* #__PURE__ */ getContext<NuxtApp>('nuxt-app')
 
diff --git a/packages/nuxt/src/build-vue-router.d.ts b/packages/nuxt/src/build-vue-router.d.ts
new file mode 100644
index 000000000000..b10a61d6204b
--- /dev/null
+++ b/packages/nuxt/src/build-vue-router.d.ts
@@ -0,0 +1,8 @@
+/**
+ * This file adds types for `#build/vue-router` and other build-time generated files that depend on Project
+ * Configuration.
+ */
+
+declare module '#build/vue-router' {
+  export * from 'vue-router'
+}
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 61ff6d33b0de..8b33fb8e94e9 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -69,14 +69,7 @@ export default defineNuxtModule({
     })
 
     if (!nuxt.options.pages) {
-      addPlugin(
-        resolve(
-          distDir,
-          useExperimentalTypedPages
-            ? 'app/plugins/router-typed'
-            : 'app/plugins/router'
-        )
-      )
+      addPlugin(resolve(distDir, 'app/plugins/router'))
       addTemplate({
         filename: 'pages.mjs',
         getContents: () => 'export { useRoute } from \'#app\''
@@ -280,6 +273,9 @@ export default defineNuxtModule({
       }
     })
 
+    // adds support to #build/vue-router
+    addBuildTimeVueRouter(useExperimentalTypedPages)
+
     // Add routes template
     addTemplate({
       filename: 'routes.mjs',
@@ -384,6 +380,48 @@ export default defineNuxtModule({
     nuxt.hook('prepare:types', ({ references }) => {
       references.push({ path: resolve(nuxt.options.buildDir, 'types/middleware.d.ts') })
       references.push({ path: resolve(nuxt.options.buildDir, 'types/layouts.d.ts') })
+      references.push({ path: resolve(nuxt.options.buildDir, 'types/internal.vue-router.d.ts') })
     })
   }
 })
+
+function addBuildTimeVueRouter (fromAuto: boolean) {
+  const vueRouterPath = fromAuto ? 'vue-router/auto' : 'vue-router'
+  addTemplate({
+    filename: 'vue-router.mjs',
+    getContents () {
+      return `export * from '${vueRouterPath}';`
+    }
+  })
+  addTemplate({
+    filename: 'types/internal.vue-router.d.ts',
+    getContents () {
+      return '' +
+      (fromAuto
+        ? `\
+import type { EditableTreeNode } from 'unplugin-vue-router'
+`
+        : '') +
+
+`
+declare module '#build/vue-router' {
+  export * from '${vueRouterPath}'
+}
+` +
+(fromAuto
+  ? `\
+
+declare module '@nuxt/schema' {
+  export interface NuxtHooks {
+    'pages:_new_extend': (page: EditableTreeNode) => void;
+    'pages:_beforeWrite': (rootPage: EditableTreeNode) => void;
+  }
+}
+`
+  : '') +
+`
+export {}
+`
+    }
+  })
+}
diff --git a/packages/nuxt/src/pages/runtime/composables.ts b/packages/nuxt/src/pages/runtime/composables.ts
index abe492a46a5c..50c5deb21c78 100644
--- a/packages/nuxt/src/pages/runtime/composables.ts
+++ b/packages/nuxt/src/pages/runtime/composables.ts
@@ -1,5 +1,5 @@
 import type { KeepAliveProps, TransitionProps, UnwrapRef } from 'vue'
-import type { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouteRecordRedirectOption } from 'vue-router'
+import type { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouteRecordRedirectOption } from '#build/vue-router'
 import type { NuxtError } from '#app'
 
 export interface PageMeta {
diff --git a/packages/nuxt/src/pages/runtime/page.ts b/packages/nuxt/src/pages/runtime/page.ts
index 34bfe754147c..2cb738504379 100644
--- a/packages/nuxt/src/pages/runtime/page.ts
+++ b/packages/nuxt/src/pages/runtime/page.ts
@@ -1,11 +1,11 @@
 import { Suspense, Transition, computed, defineComponent, h, nextTick, onMounted, provide, reactive } from 'vue'
 import type { KeepAliveProps, TransitionProps, VNode } from 'vue'
-import { RouterView } from 'vue-router'
 import { defu } from 'defu'
-import type { RouteLocation, RouteLocationNormalized, RouteLocationNormalizedLoaded } from 'vue-router'
 
 import type { RouterViewSlotProps } from './utils'
 import { generateRouteKey, wrapInKeepAlive } from './utils'
+import type { RouteLocation, RouteLocationNormalized, RouteLocationNormalizedLoaded } from '#build/vue-router'
+import { RouterView } from '#build/vue-router'
 import { useNuxtApp } from '#app/nuxt'
 import { _wrapIf } from '#app/components/utils'
 // @ts-ignore
diff --git a/packages/nuxt/src/pages/runtime/plugins/router-base.ts b/packages/nuxt/src/pages/runtime/plugins/router-base.ts
index 4cc428b1e6e9..3d1564ffc1f3 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router-base.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router-base.ts
@@ -1,15 +1,21 @@
 import { computed, isReadonly, reactive, shallowRef } from 'vue'
 import type { Ref } from 'vue'
-import type { RouteLocation, RouteRecordRaw, Router, RouterHistory, RouterOptions } from 'vue-router'
-import {
-  createMemoryHistory,
-  createWebHashHistory,
-  createWebHistory
-} from 'vue-router'
 import { createError } from 'h3'
 import { isEqual, withoutBase } from 'ufo'
 
 import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
+import {
+  createMemoryHistory,
+  createWebHashHistory,
+  createWebHistory
+} from '#build/vue-router'
+import type {
+  RouteLocation,
+  RouteRecordRaw,
+  Router,
+  RouterHistory,
+  RouterOptions
+} from '#build/vue-router'
 import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'
 import { clearError, showError, useError } from '#app/composables/error'
 import { useRequestEvent } from '#app/composables/ssr'
diff --git a/packages/nuxt/src/pages/runtime/plugins/router.ts b/packages/nuxt/src/pages/runtime/plugins/router.ts
index cd10a961d7f8..26edc0ad8266 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router.ts
@@ -1,5 +1,5 @@
-import { createRouter } from 'vue-router'
 import { createRouterPlugin } from './router-base'
+import { createRouter } from '#build/vue-router'
 
 // @ts-ignore
 import _routes from '#build/routes'
diff --git a/packages/nuxt/src/pages/runtime/router.options.ts b/packages/nuxt/src/pages/runtime/router.options.ts
index 459a40412e3f..2a6a5520282c 100644
--- a/packages/nuxt/src/pages/runtime/router.options.ts
+++ b/packages/nuxt/src/pages/runtime/router.options.ts
@@ -1,6 +1,6 @@
-import type { RouteLocationNormalized, RouterScrollBehavior } from 'vue-router'
 import { nextTick } from 'vue'
 import type { RouterConfig } from 'nuxt/schema'
+import type { RouteLocationNormalized, RouterScrollBehavior } from '#build/vue-router'
 import { useNuxtApp } from '#app/nuxt'
 // @ts-ignore
 import { appPageTransition as defaultPageTransition } from '#build/nuxt.config.mjs'
diff --git a/packages/nuxt/src/pages/runtime/utils.ts b/packages/nuxt/src/pages/runtime/utils.ts
index 6083ced61781..45f9f816024c 100644
--- a/packages/nuxt/src/pages/runtime/utils.ts
+++ b/packages/nuxt/src/pages/runtime/utils.ts
@@ -1,5 +1,5 @@
 import { KeepAlive, h } from 'vue'
-import type { RouteLocationMatched, RouteLocationNormalizedLoaded, RouterView } from 'vue-router'
+import type { RouteLocationMatched, RouteLocationNormalizedLoaded, RouterView } from '#build/vue-router'
 
 type InstanceOf<T> = T extends new (...args: any[]) => infer R ? R : never
 type RouterViewSlot = Exclude<InstanceOf<typeof RouterView>['$slots']['default'], undefined>
diff --git a/playground/pages/index.vue b/playground/pages/index.vue
index 5325f8aaf7c6..72f3c6d0656d 100644
--- a/playground/pages/index.vue
+++ b/playground/pages/index.vue
@@ -1,5 +1,10 @@
 <script lang="ts" setup>
-import { definePage } from 'vue-router/auto'
+import {
+  //
+  definePage
+  // useRoute
+} from 'vue-router/auto'
+
 const route = useRoute('/')
 
 definePageMeta({

From 792e1aba864dd91e5b48c99c5912adcbf0df1e10 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Tue, 18 Apr 2023 17:47:01 +0200
Subject: [PATCH 10/52] refactor: fix types

---
 packages/nuxt/src/build-vue-router.d.ts | 15 ++++++++++--
 packages/nuxt/src/pages/module.ts       | 31 +++++++++----------------
 playground/nuxt.config.ts               | 16 ++++++++-----
 tsconfig.json                           |  3 +++
 4 files changed, 37 insertions(+), 28 deletions(-)

diff --git a/packages/nuxt/src/build-vue-router.d.ts b/packages/nuxt/src/build-vue-router.d.ts
index b10a61d6204b..7f9253f02181 100644
--- a/packages/nuxt/src/build-vue-router.d.ts
+++ b/packages/nuxt/src/build-vue-router.d.ts
@@ -3,6 +3,17 @@
  * Configuration.
  */
 
-declare module '#build/vue-router' {
-  export * from 'vue-router'
+export {}
+
+// declare module '#build/vue-router' {
+//   export * from 'vue-router'
+// }
+
+// to have type errors during dev
+declare module '@nuxt/schema' {
+  export interface NuxtHooks {
+    'pages:extendOne': (page: EditableTreeNode) => HookResult;
+    'pages:beforeWrite': (rootPage: EditableTreeNode) => HookResult;
+  }
 }
+
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 8b33fb8e94e9..31e4faac1151 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -11,14 +11,6 @@ import type {
   Options as _UVROptions
 } from 'unplugin-vue-router'
 
-// TODO: conditional types extension
-// declare module '@nuxt/schema' {
-//   export interface NuxtHooks {
-//     'pages:_new_extend': (page: EditableTreeNode) => void;
-//     'pages:_beforeWrite': (rootPage: EditableTreeNode) => void;
-//   }
-// }
-
 import { distDir } from '../dirs'
 import { normalizeRoutes, resolvePagesRoutes } from './utils'
 import type { PageMetaPluginOptions } from './page-meta'
@@ -93,11 +85,11 @@ export default defineNuxtModule({
           dts: resolve(nuxt.options.srcDir, '.nuxt/typed-router.d.ts'),
           logs: true,
           extendRoute (route) {
-            // TODO: refactor names, add _legacy
-            return nuxt.callHook('pages:_new_extend', route)
+            // TODO: refactor names and types conditionally
+            return nuxt.callHook('pages:extendOne', route)
           },
           async beforeWriteFiles (_rootPage) {
-            await nuxt.callHook('pages:_beforeWrite', _rootPage)
+            await nuxt.callHook('pages:beforeWrite', _rootPage)
             await nuxt.callHook('pages:extend', [..._rootPage])
             rootPage = _rootPage
           }
@@ -407,20 +399,19 @@ import type { EditableTreeNode } from 'unplugin-vue-router'
 declare module '#build/vue-router' {
   export * from '${vueRouterPath}'
 }
-` +
-(fromAuto
-  ? `\
-
+` + (fromAuto
+        ? `\
 declare module '@nuxt/schema' {
   export interface NuxtHooks {
-    'pages:_new_extend': (page: EditableTreeNode) => void;
-    'pages:_beforeWrite': (rootPage: EditableTreeNode) => void;
+    'pages:extendOne': (page: EditableTreeNode) => HookResult;
+    'pages:beforeWrite': (rootPage: EditableTreeNode) => HookResult;
   }
 }
 `
-  : '') +
-`
-export {}
+        : '') +
+`\
+// TODO: is this needed?
+// export {}
 `
     }
   })
diff --git a/playground/nuxt.config.ts b/playground/nuxt.config.ts
index 98cf67072ba2..802e2fdb3fc0 100644
--- a/playground/nuxt.config.ts
+++ b/playground/nuxt.config.ts
@@ -1,4 +1,8 @@
-import { resolve } from 'node:path'
+import { dirname, resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
 
 export default defineNuxtConfig({
   experimental: {
@@ -6,15 +10,15 @@ export default defineNuxtConfig({
   },
 
   hooks: {
-    'pages:extend_legacy' (pages) {
+    'pages:extend' (pages) {
       console.log(`✅ Calling legacy pages:extend ${pages.length} pages`)
-      console.log(pages.map(page => page.fullPath))
+      console.log(pages.map(page => page.path))
     },
     'pages:beforeWrite' (rootPage) {
-      rootPage.insert('_new_extend', resolve('./pages/about.vue'))
+      rootPage.insert('_new_extend', resolve(__dirname, './pages/about.vue'))
     },
-    'pages:extend' (page) {
-      console.log('⚙️ page', page.fullPath)
+    'pages:extendOne' (page) {
+      console.log('⚙️ extendOne', page.fullPath)
     }
   }
 })
diff --git a/tsconfig.json b/tsconfig.json
index ea4716f1b385..2dfaa1091c5a 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -31,6 +31,9 @@
       ],
       "#internal/nitro/utils": [
         "./node_modules/nitropack/dist/runtime/utils"
+      ],
+      "#build/vue-router": [
+        "./node_modules/vue-router"
       ]
     }
   },

From d2a0ff28dc7d19823392ce7111a82937161ae447 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Tue, 18 Apr 2023 17:48:21 +0200
Subject: [PATCH 11/52] more shared

---
 playground/shared/index.ts | 8 ++++++++
 1 file changed, 8 insertions(+)
 create mode 100644 playground/shared/index.ts

diff --git a/playground/shared/index.ts b/playground/shared/index.ts
new file mode 100644
index 000000000000..b9a727515768
--- /dev/null
+++ b/playground/shared/index.ts
@@ -0,0 +1,8 @@
+export function useSomething () {
+  const router = useRouter()
+
+  // @ts-expect-error: something doesn't exist
+  router.push({ name: 'something' })
+
+  router.push({ name: '/' })
+}

From e2cf3c1b97d683dd0d67e801552d981fb25a6e19 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Tue, 18 Apr 2023 18:31:13 +0200
Subject: [PATCH 12/52] chore: use npm version

---
 packages/nuxt/package.json |   2 +-
 pnpm-lock.yaml             | 117 ++++++++++++++++++++++++++++++++++++-
 2 files changed, 117 insertions(+), 2 deletions(-)

diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json
index 153bba8c9daf..1c71c084e56d 100644
--- a/packages/nuxt/package.json
+++ b/packages/nuxt/package.json
@@ -98,7 +98,7 @@
     "unenv": "^1.3.1",
     "unimport": "^3.0.6",
     "unplugin": "^1.3.1",
-    "unplugin-vue-router": "file:.yalc/unplugin-vue-router",
+    "unplugin-vue-router": "^0.5.5",
     "untyped": "^1.3.2",
     "vue": "^3.2.47",
     "vue-bundle-renderer": "^1.0.3",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6f1f9ecdb6ca..95527562ea2f 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -647,6 +647,9 @@ importers:
       unplugin:
         specifier: ^1.3.1
         version: 1.3.1
+      unplugin-vue-router:
+        specifier: ^0.5.5
+        version: 0.5.5(rollup@3.20.2)(vue-router@4.1.6)(vue@3.2.47)
       untyped:
         specifier: ^1.3.2
         version: 1.3.2
@@ -2813,6 +2816,25 @@ packages:
       '@volar/typescript': 1.3.0-alpha.0
       '@volar/vue-language-core': 1.2.0
 
+  /@vue-macros/common@1.2.0(rollup@3.20.2)(vue@3.2.47):
+    resolution: {integrity: sha512-lQglnRn+8wkdAhmGQbrI0mo4SzRuY5KBjst0qi8LBDYllFKtI2brapbewUME1AXnXbVett0SRDnB2EdZXyzCmw==}
+    engines: {node: '>=14.19.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    peerDependenciesMeta:
+      vue:
+        optional: true
+    dependencies:
+      '@babel/types': 7.21.4
+      '@rollup/pluginutils': 5.0.2(rollup@3.20.2)
+      '@vue/compiler-sfc': 3.3.0-alpha.12
+      local-pkg: 0.4.3
+      magic-string-ast: 0.1.2
+      vue: 3.2.47
+    transitivePeerDependencies:
+      - rollup
+    dev: false
+
   /@vue/babel-helper-vue-transform-on@1.0.2:
     resolution: {integrity: sha512-hz4R8tS5jMn8lDq6iD+yWL6XNB699pGIVLk7WSJnn1dbpjaazsjZQkieJoRX6gW5zpYSCFqQ7jUquPNY65tQYA==}
 
@@ -2840,12 +2862,28 @@ packages:
       estree-walker: 2.0.2
       source-map: 0.6.1
 
+  /@vue/compiler-core@3.3.0-alpha.12:
+    resolution: {integrity: sha512-jAcjlvNR5e+rZ8nzJ8S3t6vpINctQhnLEjqeubvPRPgIRxnzAl6NzWgOCfqz81WO8tRoyYXyN5YF5lEyj+Ku2Q==}
+    dependencies:
+      '@babel/parser': 7.21.4
+      '@vue/shared': 3.3.0-alpha.12
+      estree-walker: 2.0.2
+      source-map-js: 1.0.2
+    dev: false
+
   /@vue/compiler-dom@3.2.47:
     resolution: {integrity: sha512-dBBnEHEPoftUiS03a4ggEig74J2YBZ2UIeyfpcRM2tavgMWo4bsEfgCGsu+uJIL/vax9S+JztH8NmQerUo7shQ==}
     dependencies:
       '@vue/compiler-core': 3.2.47
       '@vue/shared': 3.2.47
 
+  /@vue/compiler-dom@3.3.0-alpha.12:
+    resolution: {integrity: sha512-jti83D32xoyAIkvPwf3V1c/r4K498OZpJxEJCUYizsr9WAN1vI1Mm85JKTFF/phH7CDu7wqxALx/uti6SsnEtA==}
+    dependencies:
+      '@vue/compiler-core': 3.3.0-alpha.12
+      '@vue/shared': 3.3.0-alpha.12
+    dev: false
+
   /@vue/compiler-sfc@3.2.47:
     resolution: {integrity: sha512-rog05W+2IFfxjMcFw10tM9+f7i/+FFpZJJ5XHX72NP9eC2uRD+42M3pYcQqDXVYoj74kHMSEdQ/WmCjt8JFksQ==}
     dependencies:
@@ -2860,12 +2898,34 @@ packages:
       postcss: 8.4.21
       source-map: 0.6.1
 
+  /@vue/compiler-sfc@3.3.0-alpha.12:
+    resolution: {integrity: sha512-JevlKXtRuvwl5iTgCyCxOVD9Bge9Ck4pnOY03V1Vikx+Smtf/QIqJI/XMK2aFxgoPXUBj3/ueqy9kz6yW2CgNQ==}
+    dependencies:
+      '@babel/parser': 7.21.4
+      '@vue/compiler-core': 3.3.0-alpha.12
+      '@vue/compiler-dom': 3.3.0-alpha.12
+      '@vue/compiler-ssr': 3.3.0-alpha.12
+      '@vue/reactivity-transform': 3.3.0-alpha.12
+      '@vue/shared': 3.3.0-alpha.12
+      estree-walker: 2.0.2
+      magic-string: 0.30.0
+      postcss: 8.4.21
+      source-map-js: 1.0.2
+    dev: false
+
   /@vue/compiler-ssr@3.2.47:
     resolution: {integrity: sha512-wVXC+gszhulcMD8wpxMsqSOpvDZ6xKXSVWkf50Guf/S+28hTAXPDYRTbLQ3EDkOP5Xz/+SY37YiwDquKbJOgZw==}
     dependencies:
       '@vue/compiler-dom': 3.2.47
       '@vue/shared': 3.2.47
 
+  /@vue/compiler-ssr@3.3.0-alpha.12:
+    resolution: {integrity: sha512-PlitVo8v+rzQ9SxTqY+88N0kOEWbgsRj5oGrgxcACEJxt5oLvKm6eIJuFtwm4im/QtUk3SqMLTKRqTZ+CVywbg==}
+    dependencies:
+      '@vue/compiler-dom': 3.3.0-alpha.12
+      '@vue/shared': 3.3.0-alpha.12
+    dev: false
+
   /@vue/devtools-api@6.5.0:
     resolution: {integrity: sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q==}
     dev: false
@@ -2879,6 +2939,16 @@ packages:
       estree-walker: 2.0.2
       magic-string: 0.30.0
 
+  /@vue/reactivity-transform@3.3.0-alpha.12:
+    resolution: {integrity: sha512-t+vK8WOK8NXLpl6YBOpGh3sTx54j6G2NQsWjFFEv4BEMYtrPYTZswFRfT6eth8eY4X5jI5np/vHGUMCaUnf3BA==}
+    dependencies:
+      '@babel/parser': 7.21.4
+      '@vue/compiler-core': 3.3.0-alpha.12
+      '@vue/shared': 3.3.0-alpha.12
+      estree-walker: 2.0.2
+      magic-string: 0.30.0
+    dev: false
+
   /@vue/reactivity@3.2.47:
     resolution: {integrity: sha512-7khqQ/75oyyg+N/e+iwV6lpy1f5wq759NdlS1fpAhFXa8VeAIKGgk2E/C4VF59lx5b+Ezs5fpp/5WsRYXQiKxQ==}
     dependencies:
@@ -2909,6 +2979,10 @@ packages:
   /@vue/shared@3.2.47:
     resolution: {integrity: sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ==}
 
+  /@vue/shared@3.3.0-alpha.12:
+    resolution: {integrity: sha512-5Kw7f53F+Vxl8F61fsrTg056mhhHchDmSK8fRdHlfuEuNz2EICi8ehaD+0A3PMo+Zd/S9OBhkOyG4oI6g+O9PA==}
+    dev: false
+
   /@vueuse/core@9.13.0(vue@3.2.47):
     resolution: {integrity: sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==}
     dependencies:
@@ -3340,6 +3414,14 @@ packages:
     resolution: {integrity: sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==}
     dev: true
 
+  /ast-walker-scope@0.4.1:
+    resolution: {integrity: sha512-Ro3nmapMxi/remlJdzFH0tiA7A59KDbxVoLlKWaLDrPELiftb9b8w+CCyWRM+sXZH5KHRAgv8feedW6mihvCHA==}
+    engines: {node: '>=14.19.0'}
+    dependencies:
+      '@babel/parser': 7.21.4
+      '@babel/types': 7.21.4
+    dev: false
+
   /async-sema@3.1.1:
     resolution: {integrity: sha512-tLRNUXati5MFePdAk8dw7Qt7DpxPB60ofAgn8WRhW6a2rcimZnYBP9oxHiv0OHy+Wz7kPMG+t4LGdt31+4EmGg==}
 
@@ -6443,6 +6525,13 @@ packages:
     engines: {node: '>=16.14'}
     dev: true
 
+  /magic-string-ast@0.1.2:
+    resolution: {integrity: sha512-P53AZrzq7hclCU6HWj88xNZHmP15DKjMmK/vBytO1qnpYP3ul4IEZlyCE0aU3JRnmgWmZPmoTKj4Bls7v0pMyA==}
+    engines: {node: '>=14.19.0'}
+    dependencies:
+      magic-string: 0.30.0
+    dev: false
+
   /magic-string@0.30.0:
     resolution: {integrity: sha512-LA+31JYDJLs82r2ScLrlz1GjSgu66ZV518eyWT+S8VhyQn/JL0u9MeBOvQMGYiPk1DBiSN9DDMOcXvigJZaViQ==}
     engines: {node: '>=12'}
@@ -8813,6 +8902,33 @@ packages:
       - vite
     dev: true
 
+  /unplugin-vue-router@0.5.5(rollup@3.20.2)(vue-router@4.1.6)(vue@3.2.47):
+    resolution: {integrity: sha512-4ymcsmCXD5vBs7I+8bZbBVgt+qGP8myIsWmLLABFj70qqOc+dXoNLwH7jMS16dnxeKb816GHz2ZhG73qzQCoJg==}
+    peerDependencies:
+      vue-router: ^4.1.0
+    peerDependenciesMeta:
+      vue-router:
+        optional: true
+    dependencies:
+      '@babel/types': 7.21.4
+      '@rollup/pluginutils': 5.0.2(rollup@3.20.2)
+      '@vue-macros/common': 1.2.0(rollup@3.20.2)(vue@3.2.47)
+      ast-walker-scope: 0.4.1
+      chokidar: 3.5.3
+      fast-glob: 3.2.12
+      json5: 2.2.3
+      local-pkg: 0.4.3
+      mlly: 1.2.0
+      pathe: 1.1.0
+      scule: 1.0.0
+      unplugin: 1.3.1
+      vue-router: 4.1.6(vue@3.2.47)
+      yaml: 2.2.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: false
+
   /unplugin@0.10.2:
     resolution: {integrity: sha512-6rk7GUa4ICYjae5PrAllvcDeuT8pA9+j5J5EkxbMFaV+SalHhxZ7X2dohMzu6C3XzsMT+6jwR/+pwPNR3uK9MA==}
     dependencies:
@@ -9554,7 +9670,6 @@ packages:
   /yaml@2.2.1:
     resolution: {integrity: sha512-e0WHiYql7+9wr4cWMx3TVQrNwejKaEe7/rHNmQmqRjazfOP5W8PB6Jpebb5o6fIapbz9o9+2ipcaTM2ZwDI6lw==}
     engines: {node: '>= 14'}
-    dev: true
 
   /yargs-parser@21.1.1:
     resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==}

From 3e036380b2340b32fc876b43411b1ae8b5b33229 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 14:07:34 +0100
Subject: [PATCH 13/52] refactor: use custom `#vue-router` alias

---
 packages/nuxi/src/utils/prepare.ts            |  2 +-
 packages/nuxt/src/app/components/layout.ts    |  4 +--
 packages/nuxt/src/app/components/nuxt-link.ts |  2 +-
 packages/nuxt/src/app/composables/preload.ts  |  2 +-
 packages/nuxt/src/app/composables/router.ts   |  2 +-
 packages/nuxt/src/app/nuxt.ts                 |  2 +-
 packages/nuxt/src/build-vue-router.d.ts       | 14 +++-----
 packages/nuxt/src/pages/module.ts             | 32 +++++++++----------
 .../nuxt/src/pages/runtime/composables.ts     |  2 +-
 packages/nuxt/src/pages/runtime/page.ts       |  4 +--
 .../src/pages/runtime/plugins/router-base.ts  |  8 ++---
 .../nuxt/src/pages/runtime/plugins/router.ts  |  2 +-
 .../nuxt/src/pages/runtime/router.options.ts  |  2 +-
 packages/nuxt/src/pages/runtime/utils.ts      |  2 +-
 tsconfig.json                                 |  2 +-
 15 files changed, 38 insertions(+), 44 deletions(-)

diff --git a/packages/nuxi/src/utils/prepare.ts b/packages/nuxi/src/utils/prepare.ts
index e83a0a429f3d..9a72c56d154e 100644
--- a/packages/nuxi/src/utils/prepare.ts
+++ b/packages/nuxi/src/utils/prepare.ts
@@ -30,7 +30,7 @@ export const writeTypes = async (nuxt: Nuxt) => {
       join(relative(nuxt.options.buildDir, nuxt.options.rootDir), '**/*'),
       ...nuxt.options.srcDir !== nuxt.options.rootDir ? [join(relative(nuxt.options.buildDir, nuxt.options.srcDir), '**/*')] : [],
       ...nuxt.options.typescript.includeWorkspace && nuxt.options.workspaceDir !== nuxt.options.rootDir ? [join(relative(nuxt.options.buildDir, nuxt.options.workspaceDir), '**/*')] : []
-    ].concat(nuxt.options.experimental.typedPages ? './typed-router.d.ts' : []),
+    ],
     exclude: [
       // nitro generate output: https://github.com/nuxt/nuxt/blob/main/packages/nuxt/src/core/nitro.ts#L186
       relative(nuxt.options.buildDir, resolve(nuxt.options.rootDir, 'dist'))
diff --git a/packages/nuxt/src/app/components/layout.ts b/packages/nuxt/src/app/components/layout.ts
index efe0d6f9434a..13fbeb923b76 100644
--- a/packages/nuxt/src/app/components/layout.ts
+++ b/packages/nuxt/src/app/components/layout.ts
@@ -1,8 +1,8 @@
 import type { Ref, VNode } from 'vue'
 import { Transition, computed, defineComponent, h, inject, nextTick, onMounted, unref } from 'vue'
+import type { RouteLocationNormalizedLoaded } from 'vue-router'
 import { _wrapIf } from './utils'
-import type { RouteLocationNormalizedLoaded } from '#build/vue-router'
-import { useRoute } from '~/../packages/nuxt/src/app/composables'
+import { useRoute } from '#app/composables/router'
 // @ts-ignore
 import { useRoute as useVueRouterRoute } from '#build/pages'
 // @ts-ignore
diff --git a/packages/nuxt/src/app/components/nuxt-link.ts b/packages/nuxt/src/app/components/nuxt-link.ts
index 6674fc1014e7..1cecf11c05ab 100644
--- a/packages/nuxt/src/app/components/nuxt-link.ts
+++ b/packages/nuxt/src/app/components/nuxt-link.ts
@@ -7,7 +7,7 @@ import { onNuxtReady } from '../composables/ready'
 import { navigateTo, useRouter } from '../composables/router'
 import { useNuxtApp } from '../nuxt'
 import { cancelIdleCallback, requestIdleCallback } from '../compat/idle-callback'
-import type { RouteLocation, RouteLocationRaw } from '#build/vue-router'
+import type { RouteLocation, RouteLocationRaw } from '#vue-router'
 
 const firstNonUndefined = <T> (...args: (T | undefined)[]) => args.find(arg => arg !== undefined)
 
diff --git a/packages/nuxt/src/app/composables/preload.ts b/packages/nuxt/src/app/composables/preload.ts
index e29108d8b733..6c47cc67c825 100644
--- a/packages/nuxt/src/app/composables/preload.ts
+++ b/packages/nuxt/src/app/composables/preload.ts
@@ -1,7 +1,7 @@
 import type { Component } from 'vue'
 import { useNuxtApp } from '../nuxt'
 import { useRouter } from './router'
-import type { RouteLocationRaw, Router } from '#build/vue-router'
+import type { RouteLocationRaw, Router } from '#vue-router'
 
 /**
  * Preload a component or components that have been globally registered.
diff --git a/packages/nuxt/src/app/composables/router.ts b/packages/nuxt/src/app/composables/router.ts
index dc4a6a935f6c..e10ad3f40c9a 100644
--- a/packages/nuxt/src/app/composables/router.ts
+++ b/packages/nuxt/src/app/composables/router.ts
@@ -8,7 +8,7 @@ import type { NuxtError } from './error'
 import { createError } from './error'
 import { useState } from './state'
 import { setResponseStatus } from './ssr'
-import type { NavigationFailure, NavigationGuard, RouteLocationNormalized, RouteLocationPathRaw, RouteLocationRaw, Router, useRoute as _useRoute, useRouter as _useRouter } from '#build/vue-router'
+import type { NavigationFailure, NavigationGuard, RouteLocationNormalized, RouteLocationPathRaw, RouteLocationRaw, Router, useRoute as _useRoute, useRouter as _useRouter } from '#vue-router'
 
 import type { PageMeta } from '#app'
 
diff --git a/packages/nuxt/src/app/nuxt.ts b/packages/nuxt/src/app/nuxt.ts
index 47c9288ad5f4..40a98561dd2e 100644
--- a/packages/nuxt/src/app/nuxt.ts
+++ b/packages/nuxt/src/app/nuxt.ts
@@ -12,7 +12,7 @@ import type { AppConfig, AppConfigInput, RuntimeConfig } from 'nuxt/schema'
 import type { NuxtIslandContext } from '../core/runtime/nitro/renderer'
 import type { RouteMiddleware } from '../../app'
 import type { NuxtError } from '../app/composables/error'
-import type { RouteLocationNormalizedLoaded } from '#build/vue-router'
+import type { RouteLocationNormalizedLoaded } from '#vue-router'
 
 const nuxtAppCtx = /* #__PURE__ */ getContext<NuxtApp>('nuxt-app')
 
diff --git a/packages/nuxt/src/build-vue-router.d.ts b/packages/nuxt/src/build-vue-router.d.ts
index 7f9253f02181..2cfe1dedd9c6 100644
--- a/packages/nuxt/src/build-vue-router.d.ts
+++ b/packages/nuxt/src/build-vue-router.d.ts
@@ -1,19 +1,13 @@
 /**
- * This file adds types for `#build/vue-router` and other build-time generated files that depend on Project
- * Configuration.
+ * This file adds module hooks for typed router support.
  */
 
-export {}
-
-// declare module '#build/vue-router' {
-//   export * from 'vue-router'
-// }
-
+import type { EditableTreeNode, HookResult } from 'unplugin-vue-router/types'
 // to have type errors during dev
 declare module '@nuxt/schema' {
   export interface NuxtHooks {
-    'pages:extendOne': (page: EditableTreeNode) => HookResult;
-    'pages:beforeWrite': (rootPage: EditableTreeNode) => HookResult;
+    'pages:extendOne': (page: EditableTreeNode) => HookResult
+    'pages:beforeWrite': (rootPage: EditableTreeNode) => HookResult
   }
 }
 
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 31e4faac1151..cfed53ce3d47 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -98,6 +98,10 @@ export default defineNuxtModule({
           prepend: true
         }
       )
+      nuxt.hook('prepare:types', ({ references }) => {
+        references.push({ path: './typed-router.d.ts' })
+      })
+
       // FIXME: add webpack plugin as well
     }
 
@@ -265,7 +269,7 @@ export default defineNuxtModule({
       }
     })
 
-    // adds support to #build/vue-router
+    // adds support to #vue-router
     addBuildTimeVueRouter(useExperimentalTypedPages)
 
     // Add routes template
@@ -368,11 +372,13 @@ export default defineNuxtModule({
       filePath: resolve(distDir, 'pages/runtime/page')
     })
 
+    nuxt.options.alias['#vue-router'] = join(nuxt.options.buildDir, 'vue-router')
+
     // Add declarations for middleware keys
     nuxt.hook('prepare:types', ({ references }) => {
       references.push({ path: resolve(nuxt.options.buildDir, 'types/middleware.d.ts') })
       references.push({ path: resolve(nuxt.options.buildDir, 'types/layouts.d.ts') })
-      references.push({ path: resolve(nuxt.options.buildDir, 'types/internal.vue-router.d.ts') })
+      references.push({ path: resolve(nuxt.options.buildDir, 'vue-router.d.ts') })
     })
   }
 })
@@ -386,21 +392,19 @@ function addBuildTimeVueRouter (fromAuto: boolean) {
     }
   })
   addTemplate({
-    filename: 'types/internal.vue-router.d.ts',
+    filename: 'vue-router.d.ts',
     getContents () {
       return '' +
-      (fromAuto
-        ? `\
+        (fromAuto
+          ? `\
 import type { EditableTreeNode } from 'unplugin-vue-router'
 `
-        : '') +
+          : '') +
 
-`
-declare module '#build/vue-router' {
-  export * from '${vueRouterPath}'
-}
+        `
+export * from '${vueRouterPath}'
 ` + (fromAuto
-        ? `\
+          ? `\
 declare module '@nuxt/schema' {
   export interface NuxtHooks {
     'pages:extendOne': (page: EditableTreeNode) => HookResult;
@@ -408,11 +412,7 @@ declare module '@nuxt/schema' {
   }
 }
 `
-        : '') +
-`\
-// TODO: is this needed?
-// export {}
-`
+          : '')
     }
   })
 }
diff --git a/packages/nuxt/src/pages/runtime/composables.ts b/packages/nuxt/src/pages/runtime/composables.ts
index 50c5deb21c78..a5a08e67dbc4 100644
--- a/packages/nuxt/src/pages/runtime/composables.ts
+++ b/packages/nuxt/src/pages/runtime/composables.ts
@@ -1,5 +1,5 @@
 import type { KeepAliveProps, TransitionProps, UnwrapRef } from 'vue'
-import type { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouteRecordRedirectOption } from '#build/vue-router'
+import type { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouteRecordRedirectOption } from '#vue-router'
 import type { NuxtError } from '#app'
 
 export interface PageMeta {
diff --git a/packages/nuxt/src/pages/runtime/page.ts b/packages/nuxt/src/pages/runtime/page.ts
index 2cb738504379..212af49fdb77 100644
--- a/packages/nuxt/src/pages/runtime/page.ts
+++ b/packages/nuxt/src/pages/runtime/page.ts
@@ -4,8 +4,8 @@ import { defu } from 'defu'
 
 import type { RouterViewSlotProps } from './utils'
 import { generateRouteKey, wrapInKeepAlive } from './utils'
-import type { RouteLocation, RouteLocationNormalized, RouteLocationNormalizedLoaded } from '#build/vue-router'
-import { RouterView } from '#build/vue-router'
+import type { RouteLocation, RouteLocationNormalized, RouteLocationNormalizedLoaded } from '#vue-router'
+import { RouterView } from '#vue-router'
 import { useNuxtApp } from '#app/nuxt'
 import { _wrapIf } from '#app/components/utils'
 // @ts-ignore
diff --git a/packages/nuxt/src/pages/runtime/plugins/router-base.ts b/packages/nuxt/src/pages/runtime/plugins/router-base.ts
index 3d1564ffc1f3..d7776a03bbfb 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router-base.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router-base.ts
@@ -8,14 +8,14 @@ import {
   createMemoryHistory,
   createWebHashHistory,
   createWebHistory
-} from '#build/vue-router'
+} from '#vue-router'
 import type {
   RouteLocation,
   RouteRecordRaw,
   Router,
   RouterHistory,
   RouterOptions
-} from '#build/vue-router'
+} from '#vue-router'
 import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'
 import { clearError, showError, useError } from '#app/composables/error'
 import { useRequestEvent } from '#app/composables/ssr'
@@ -51,8 +51,8 @@ function createCurrentLocation (
 interface RouterFactory {
   (
     history: RouterHistory,
-    routerOptions: RouterOptions & { routes?: (routes: RouteRecordRaw[]) => RouteRecordRaw[]}
-  ): Router;
+    routerOptions: RouterOptions & { routes?: (routes: RouteRecordRaw[]) => RouteRecordRaw[] }
+  ): Router
 }
 
 export function createRouterPlugin (routerFactory: RouterFactory) {
diff --git a/packages/nuxt/src/pages/runtime/plugins/router.ts b/packages/nuxt/src/pages/runtime/plugins/router.ts
index 26edc0ad8266..9eda7c4ff09b 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router.ts
@@ -1,5 +1,5 @@
 import { createRouterPlugin } from './router-base'
-import { createRouter } from '#build/vue-router'
+import { createRouter } from '#vue-router'
 
 // @ts-ignore
 import _routes from '#build/routes'
diff --git a/packages/nuxt/src/pages/runtime/router.options.ts b/packages/nuxt/src/pages/runtime/router.options.ts
index 2a6a5520282c..453729a47561 100644
--- a/packages/nuxt/src/pages/runtime/router.options.ts
+++ b/packages/nuxt/src/pages/runtime/router.options.ts
@@ -1,6 +1,6 @@
 import { nextTick } from 'vue'
 import type { RouterConfig } from 'nuxt/schema'
-import type { RouteLocationNormalized, RouterScrollBehavior } from '#build/vue-router'
+import type { RouteLocationNormalized, RouterScrollBehavior } from '#vue-router'
 import { useNuxtApp } from '#app/nuxt'
 // @ts-ignore
 import { appPageTransition as defaultPageTransition } from '#build/nuxt.config.mjs'
diff --git a/packages/nuxt/src/pages/runtime/utils.ts b/packages/nuxt/src/pages/runtime/utils.ts
index 45f9f816024c..1004c8bd9b5a 100644
--- a/packages/nuxt/src/pages/runtime/utils.ts
+++ b/packages/nuxt/src/pages/runtime/utils.ts
@@ -1,5 +1,5 @@
 import { KeepAlive, h } from 'vue'
-import type { RouteLocationMatched, RouteLocationNormalizedLoaded, RouterView } from '#build/vue-router'
+import type { RouteLocationMatched, RouteLocationNormalizedLoaded, RouterView } from '#vue-router'
 
 type InstanceOf<T> = T extends new (...args: any[]) => infer R ? R : never
 type RouterViewSlot = Exclude<InstanceOf<typeof RouterView>['$slots']['default'], undefined>
diff --git a/tsconfig.json b/tsconfig.json
index 2dfaa1091c5a..7c6d195b17e6 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -32,7 +32,7 @@
       "#internal/nitro/utils": [
         "./node_modules/nitropack/dist/runtime/utils"
       ],
-      "#build/vue-router": [
+      "#vue-router": [
         "./node_modules/vue-router"
       ]
     }

From ada04edb75ffae5f5d9a744731f9189d832ba7d3 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 14:23:14 +0100
Subject: [PATCH 14/52] refactor: merge back into single plugin

---
 .../src/pages/runtime/plugins/router-base.ts  | 211 ------------------
 .../src/pages/runtime/plugins/router-typed.ts |   9 -
 .../nuxt/src/pages/runtime/plugins/router.ts  | 211 +++++++++++++++++-
 3 files changed, 201 insertions(+), 230 deletions(-)
 delete mode 100644 packages/nuxt/src/pages/runtime/plugins/router-base.ts
 delete mode 100644 packages/nuxt/src/pages/runtime/plugins/router-typed.ts

diff --git a/packages/nuxt/src/pages/runtime/plugins/router-base.ts b/packages/nuxt/src/pages/runtime/plugins/router-base.ts
deleted file mode 100644
index d7776a03bbfb..000000000000
--- a/packages/nuxt/src/pages/runtime/plugins/router-base.ts
+++ /dev/null
@@ -1,211 +0,0 @@
-import { computed, isReadonly, reactive, shallowRef } from 'vue'
-import type { Ref } from 'vue'
-import { createError } from 'h3'
-import { isEqual, withoutBase } from 'ufo'
-
-import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
-import {
-  createMemoryHistory,
-  createWebHashHistory,
-  createWebHistory
-} from '#vue-router'
-import type {
-  RouteLocation,
-  RouteRecordRaw,
-  Router,
-  RouterHistory,
-  RouterOptions
-} from '#vue-router'
-import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'
-import { clearError, showError, useError } from '#app/composables/error'
-import { useRequestEvent } from '#app/composables/ssr'
-import { useState } from '#app/composables/state'
-import { navigateTo } from '#app/composables/router'
-
-// @ts-ignore
-import routerOptions from '#build/router.options'
-// @ts-ignore
-import { globalMiddleware, namedMiddleware } from '#build/middleware'
-
-// https://github.com/vuejs/router/blob/4a0cc8b9c1e642cdf47cc007fa5bbebde70afc66/packages/router/src/history/html5.ts#L37
-function createCurrentLocation (
-  base: string,
-  location: Location
-): string {
-  const { pathname, search, hash } = location
-  // allows hash bases like #, /#, #/, #!, #!/, /#!/, or even /folder#end
-  const hashPos = base.indexOf('#')
-  if (hashPos > -1) {
-    const slicePos = hash.includes(base.slice(hashPos))
-      ? base.slice(hashPos).length
-      : 1
-    let pathFromHash = hash.slice(slicePos)
-    // prepend the starting slash to hash so the url starts with /#
-    if (pathFromHash[0] !== '/') { pathFromHash = '/' + pathFromHash }
-    return withoutBase(pathFromHash, '')
-  }
-  const path = withoutBase(pathname, base)
-  return path + search + hash
-}
-
-interface RouterFactory {
-  (
-    history: RouterHistory,
-    routerOptions: RouterOptions & { routes?: (routes: RouteRecordRaw[]) => RouteRecordRaw[] }
-  ): Router
-}
-
-export function createRouterPlugin (routerFactory: RouterFactory) {
-  return defineNuxtPlugin({
-    name: 'nuxt:router',
-    enforce: 'pre',
-    async setup (nuxtApp) {
-      let routerBase = useRuntimeConfig().app.baseURL
-      if (routerOptions.hashMode && !routerBase.includes('#')) {
-        // allow the user to provide a `#` in the middle: `/base/#/app`
-        routerBase += '#'
-      }
-
-      const history = routerOptions.history?.(routerBase) ?? (process.client
-        ? (routerOptions.hashMode ? createWebHashHistory(routerBase) : createWebHistory(routerBase))
-        : createMemoryHistory(routerBase)
-      )
-
-      const initialURL = process.server ? nuxtApp.ssrContext!.url : createCurrentLocation(routerBase, window.location)
-      const router = routerFactory(history, routerOptions)
-      nuxtApp.vueApp.use(router)
-
-      const previousRoute = shallowRef(router.currentRoute.value)
-      router.afterEach((_to, from) => {
-        previousRoute.value = from
-      })
-
-      Object.defineProperty(nuxtApp.vueApp.config.globalProperties, 'previousRoute', {
-        get: () => previousRoute.value
-      })
-
-      // Allows suspending the route object until page navigation completes
-      const _route = shallowRef(router.resolve(initialURL) as RouteLocation)
-      const syncCurrentRoute = () => { _route.value = router.currentRoute.value }
-      nuxtApp.hook('page:finish', syncCurrentRoute)
-      router.afterEach((to, from) => {
-        // We won't trigger suspense if the component is reused between routes
-        // so we need to update the route manually
-        if (to.matched[0]?.components?.default === from.matched[0]?.components?.default) {
-          syncCurrentRoute()
-        }
-      })
-
-      // https://github.com/vuejs/router/blob/main/packages/router/src/router.ts#L1225-L1233
-      const route = {} as RouteLocation
-      for (const key in _route.value) {
-        (route as any)[key] = computed(() => _route.value[key as keyof RouteLocation])
-      }
-
-      nuxtApp._route = reactive(route)
-
-      nuxtApp._middleware = nuxtApp._middleware || {
-        global: [],
-        named: {}
-      }
-
-      const error = useError()
-
-      try {
-        if (process.server) {
-          await router.push(initialURL)
-        }
-
-        await router.isReady()
-      } catch (error: any) {
-        // We'll catch 404s here
-        await callWithNuxt(nuxtApp, showError, [error])
-      }
-
-      const initialLayout = useState('_layout')
-      router.beforeEach(async (to, from) => {
-        to.meta = reactive(to.meta)
-        if (nuxtApp.isHydrating && initialLayout.value && !isReadonly(to.meta.layout)) {
-          to.meta.layout = initialLayout.value as Exclude<PageMeta['layout'], Ref | false>
-        }
-        nuxtApp._processingMiddleware = true
-
-        type MiddlewareDef = string | RouteMiddleware
-        const middlewareEntries = new Set<MiddlewareDef>([...globalMiddleware, ...nuxtApp._middleware.global])
-        for (const component of to.matched) {
-          const componentMiddleware = component.meta.middleware as MiddlewareDef | MiddlewareDef[]
-          if (!componentMiddleware) { continue }
-          if (Array.isArray(componentMiddleware)) {
-            for (const entry of componentMiddleware) {
-              middlewareEntries.add(entry)
-            }
-          } else {
-            middlewareEntries.add(componentMiddleware)
-          }
-        }
-
-        for (const entry of middlewareEntries) {
-          const middleware = typeof entry === 'string' ? nuxtApp._middleware.named[entry] || await namedMiddleware[entry]?.().then((r: any) => r.default || r) : entry
-
-          if (!middleware) {
-            if (process.dev) {
-              throw new Error(`Unknown route middleware: '${entry}'. Valid middleware: ${Object.keys(namedMiddleware).map(mw => `'${mw}'`).join(', ')}.`)
-            }
-            throw new Error(`Unknown route middleware: '${entry}'.`)
-          }
-
-          const result = await callWithNuxt(nuxtApp, middleware, [to, from])
-          if (process.server || (!nuxtApp.payload.serverRendered && nuxtApp.isHydrating)) {
-            if (result === false || result instanceof Error) {
-              const error = result || createError({
-                statusCode: 404,
-                statusMessage: `Page Not Found: ${initialURL}`
-              })
-              await callWithNuxt(nuxtApp, showError, [error])
-              return false
-            }
-          }
-          if (result || result === false) { return result }
-        }
-      })
-
-      router.afterEach(async (to) => {
-        delete nuxtApp._processingMiddleware
-
-        if (process.client && !nuxtApp.isHydrating && error.value) {
-          // Clear any existing errors
-          await callWithNuxt(nuxtApp, clearError)
-        }
-        if (to.matched.length === 0) {
-          await callWithNuxt(nuxtApp, showError, [createError({
-            statusCode: 404,
-            fatal: false,
-            statusMessage: `Page not found: ${to.fullPath}`
-          })])
-        } else if (process.server) {
-          const currentURL = to.fullPath || '/'
-          if (!isEqual(currentURL, initialURL, { trailingSlash: true })) {
-            const event = await callWithNuxt(nuxtApp, useRequestEvent)
-            const options = { redirectCode: event.node.res.statusCode !== 200 ? event.node.res.statusCode || 302 : 302 }
-            await callWithNuxt(nuxtApp, navigateTo, [currentURL, options])
-          }
-        }
-      })
-
-      nuxtApp.hooks.hookOnce('app:created', async () => {
-        try {
-          await router.replace({
-            ...router.resolve(initialURL),
-            name: undefined, // #4920, #$4982
-            force: true
-          })
-        } catch (error: any) {
-          // We'll catch middleware errors or deliberate exceptions here
-          await callWithNuxt(nuxtApp, showError, [error])
-        }
-      })
-
-      return { provide: { router } }
-    }
-  }) as Plugin<{ router: Router }>
-}
diff --git a/packages/nuxt/src/pages/runtime/plugins/router-typed.ts b/packages/nuxt/src/pages/runtime/plugins/router-typed.ts
deleted file mode 100644
index 16f53a373005..000000000000
--- a/packages/nuxt/src/pages/runtime/plugins/router-typed.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { createRouter } from 'vue-router/auto'
-import { createRouterPlugin } from './router-base'
-
-export default createRouterPlugin((history, routerOptions) => {
-  return createRouter({
-    ...routerOptions,
-    history
-  })
-})
diff --git a/packages/nuxt/src/pages/runtime/plugins/router.ts b/packages/nuxt/src/pages/runtime/plugins/router.ts
index 9eda7c4ff09b..41ec563d438a 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router.ts
@@ -1,14 +1,205 @@
-import { createRouterPlugin } from './router-base'
-import { createRouter } from '#vue-router'
+import { computed, isReadonly, reactive, shallowRef } from 'vue'
+import type { Ref } from 'vue'
+import { createError } from 'h3'
+import { isEqual, withoutBase } from 'ufo'
+
+import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
+import {
+  createMemoryHistory,
+  createRouter,
+  createWebHashHistory,
+  createWebHistory
+} from '#vue-router'
+import type { RouteLocation, Router } from '#vue-router'
+import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'
+import { clearError, showError, useError } from '#app/composables/error'
+import { useRequestEvent } from '#app/composables/ssr'
+import { useState } from '#app/composables/state'
+import { navigateTo } from '#app/composables/router'
 
 // @ts-ignore
 import _routes from '#build/routes'
+// @ts-ignore
+import routerOptions from '#build/router.options'
+// @ts-ignore
+import { globalMiddleware, namedMiddleware } from '#build/middleware'
+
+// https://github.com/vuejs/router/blob/4a0cc8b9c1e642cdf47cc007fa5bbebde70afc66/packages/router/src/history/html5.ts#L37
+function createCurrentLocation (
+  base: string,
+  location: Location
+): string {
+  const { pathname, search, hash } = location
+  // allows hash bases like #, /#, #/, #!, #!/, /#!/, or even /folder#end
+  const hashPos = base.indexOf('#')
+  if (hashPos > -1) {
+    const slicePos = hash.includes(base.slice(hashPos))
+      ? base.slice(hashPos).length
+      : 1
+    let pathFromHash = hash.slice(slicePos)
+    // prepend the starting slash to hash so the url starts with /#
+    if (pathFromHash[0] !== '/') { pathFromHash = '/' + pathFromHash }
+    return withoutBase(pathFromHash, '')
+  }
+  const path = withoutBase(pathname, base)
+  return path + search + hash
+}
+
+export default defineNuxtPlugin({
+  name: 'nuxt:router',
+  enforce: 'pre',
+  async setup (nuxtApp) {
+    let routerBase = useRuntimeConfig().app.baseURL
+    if (routerOptions.hashMode && !routerBase.includes('#')) {
+      // allow the user to provide a `#` in the middle: `/base/#/app`
+      routerBase += '#'
+    }
+
+    const history = routerOptions.history?.(routerBase) ?? (process.client
+      ? (routerOptions.hashMode ? createWebHashHistory(routerBase) : createWebHistory(routerBase))
+      : createMemoryHistory(routerBase)
+    )
+
+    const routes = routerOptions.routes?.(_routes) ?? _routes
+
+    const initialURL = process.server ? nuxtApp.ssrContext!.url : createCurrentLocation(routerBase, window.location)
+    const router = createRouter({
+      ...routerOptions,
+      history,
+      routes
+    })
+    nuxtApp.vueApp.use(router)
+
+    const previousRoute = shallowRef(router.currentRoute.value)
+    router.afterEach((_to, from) => {
+      previousRoute.value = from
+    })
+
+    Object.defineProperty(nuxtApp.vueApp.config.globalProperties, 'previousRoute', {
+      get: () => previousRoute.value
+    })
+
+    // Allows suspending the route object until page navigation completes
+    const _route = shallowRef(router.resolve(initialURL) as RouteLocation)
+    const syncCurrentRoute = () => { _route.value = router.currentRoute.value }
+    nuxtApp.hook('page:finish', syncCurrentRoute)
+    router.afterEach((to, from) => {
+      // We won't trigger suspense if the component is reused between routes
+      // so we need to update the route manually
+      if (to.matched[0]?.components?.default === from.matched[0]?.components?.default) {
+        syncCurrentRoute()
+      }
+    })
+
+    // https://github.com/vuejs/router/blob/main/packages/router/src/router.ts#L1225-L1233
+    const route = {} as RouteLocation
+    for (const key in _route.value) {
+      (route as any)[key] = computed(() => _route.value[key as keyof RouteLocation])
+    }
+
+    nuxtApp._route = reactive(route)
+
+    nuxtApp._middleware = nuxtApp._middleware || {
+      global: [],
+      named: {}
+    }
+
+    const error = useError()
+
+    try {
+      if (process.server) {
+        await router.push(initialURL)
+      }
+
+      await router.isReady()
+    } catch (error: any) {
+      // We'll catch 404s here
+      await callWithNuxt(nuxtApp, showError, [error])
+    }
+
+    const initialLayout = useState('_layout')
+    router.beforeEach(async (to, from) => {
+      to.meta = reactive(to.meta)
+      if (nuxtApp.isHydrating && initialLayout.value && !isReadonly(to.meta.layout)) {
+        to.meta.layout = initialLayout.value as Exclude<PageMeta['layout'], Ref | false>
+      }
+      nuxtApp._processingMiddleware = true
+
+      type MiddlewareDef = string | RouteMiddleware
+      const middlewareEntries = new Set<MiddlewareDef>([...globalMiddleware, ...nuxtApp._middleware.global])
+      for (const component of to.matched) {
+        const componentMiddleware = component.meta.middleware as MiddlewareDef | MiddlewareDef[]
+        if (!componentMiddleware) { continue }
+        if (Array.isArray(componentMiddleware)) {
+          for (const entry of componentMiddleware) {
+            middlewareEntries.add(entry)
+          }
+        } else {
+          middlewareEntries.add(componentMiddleware)
+        }
+      }
+
+      for (const entry of middlewareEntries) {
+        const middleware = typeof entry === 'string' ? nuxtApp._middleware.named[entry] || await namedMiddleware[entry]?.().then((r: any) => r.default || r) : entry
+
+        if (!middleware) {
+          if (process.dev) {
+            throw new Error(`Unknown route middleware: '${entry}'. Valid middleware: ${Object.keys(namedMiddleware).map(mw => `'${mw}'`).join(', ')}.`)
+          }
+          throw new Error(`Unknown route middleware: '${entry}'.`)
+        }
+
+        const result = await callWithNuxt(nuxtApp, middleware, [to, from])
+        if (process.server || (!nuxtApp.payload.serverRendered && nuxtApp.isHydrating)) {
+          if (result === false || result instanceof Error) {
+            const error = result || createError({
+              statusCode: 404,
+              statusMessage: `Page Not Found: ${initialURL}`
+            })
+            await callWithNuxt(nuxtApp, showError, [error])
+            return false
+          }
+        }
+        if (result || result === false) { return result }
+      }
+    })
+
+    router.afterEach(async (to) => {
+      delete nuxtApp._processingMiddleware
+
+      if (process.client && !nuxtApp.isHydrating && error.value) {
+        // Clear any existing errors
+        await callWithNuxt(nuxtApp, clearError)
+      }
+      if (to.matched.length === 0) {
+        await callWithNuxt(nuxtApp, showError, [createError({
+          statusCode: 404,
+          fatal: false,
+          statusMessage: `Page not found: ${to.fullPath}`
+        })])
+      } else if (process.server) {
+        const currentURL = to.fullPath || '/'
+        if (!isEqual(currentURL, initialURL, { trailingSlash: true })) {
+          const event = await callWithNuxt(nuxtApp, useRequestEvent)
+          const options = { redirectCode: event.node.res.statusCode !== 200 ? event.node.res.statusCode || 302 : 302 }
+          await callWithNuxt(nuxtApp, navigateTo, [currentURL, options])
+        }
+      }
+    })
+
+    nuxtApp.hooks.hookOnce('app:created', async () => {
+      try {
+        await router.replace({
+          ...router.resolve(initialURL),
+          name: undefined, // #4920, #$4982
+          force: true
+        })
+      } catch (error: any) {
+        // We'll catch middleware errors or deliberate exceptions here
+        await callWithNuxt(nuxtApp, showError, [error])
+      }
+    })
 
-export default createRouterPlugin((history, routerOptions) => {
-  const routes = routerOptions.routes?.(_routes) ?? _routes
-  return createRouter({
-    ...routerOptions,
-    history,
-    routes
-  })
-})
+    return { provide: { router } }
+  }
+}) as Plugin<{ router: Router }>

From 325a818e1f34668cea3128fc13f2df57d15ab7a3 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 14:41:38 +0100
Subject: [PATCH 15/52] fix: write types when preparing

---
 packages/nuxt/src/pages/module.ts | 42 +++++++++++++++++++------------
 1 file changed, 26 insertions(+), 16 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index cfed53ce3d47..febd1f921250 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -6,6 +6,10 @@ import escapeRE from 'escape-string-regexp'
 import { joinURL } from 'ufo'
 import type { NuxtApp, NuxtPage } from 'nuxt/schema'
 import VueRouter from 'unplugin-vue-router/vite'
+import {
+  createRoutesContext
+} from 'unplugin-vue-router'
+import { resolveOptions } from 'unplugin-vue-router/options'
 import type {
   EditableTreeNode,
   Options as _UVROptions
@@ -20,7 +24,7 @@ export default defineNuxtModule({
   meta: {
     name: 'pages'
   },
-  setup (_options, nuxt) {
+  async setup (_options, nuxt) {
     const useExperimentalTypedPages = nuxt.options.experimental.typedPages
 
     const pagesDirs = nuxt.options._layers.map(
@@ -77,23 +81,29 @@ export default defineNuxtModule({
     let rootPage: EditableTreeNode | undefined
     if (useExperimentalTypedPages) {
       console.log('📄 Adding pages module')
+      const options: _UVROptions = {
+
+        routesFolder: pagesDirs,
+        // FIXME: find the root of the project
+        dts: resolve(nuxt.options.srcDir, '.nuxt/typed-router.d.ts'),
+        logs: true,
+        extendRoute (route) {
+          // TODO: refactor names and types conditionally
+          return nuxt.callHook('pages:extendOne', route)
+        },
+        async beforeWriteFiles (_rootPage) {
+          await nuxt.callHook('pages:beforeWrite', _rootPage)
+          await nuxt.callHook('pages:extend', [..._rootPage])
+          rootPage = _rootPage
+        }
+      }
+
+      if (nuxt.options._prepare) {
+        await createRoutesContext(resolveOptions(options)).scanPages(false)
+      }
 
       addVitePlugin(
-        VueRouter({
-          routesFolder: pagesDirs,
-          // FIXME: find the root of the project
-          dts: resolve(nuxt.options.srcDir, '.nuxt/typed-router.d.ts'),
-          logs: true,
-          extendRoute (route) {
-            // TODO: refactor names and types conditionally
-            return nuxt.callHook('pages:extendOne', route)
-          },
-          async beforeWriteFiles (_rootPage) {
-            await nuxt.callHook('pages:beforeWrite', _rootPage)
-            await nuxt.callHook('pages:extend', [..._rootPage])
-            rootPage = _rootPage
-          }
-        }),
+        VueRouter(options),
         {
           prepend: true
         }

From f38cacef85c850a2dca66f9910680bfd6dbae797 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 14:49:21 +0100
Subject: [PATCH 16/52] feat: add webpack plugin

---
 packages/nuxt/src/pages/module.ts | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index febd1f921250..b9da19551930 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -5,7 +5,8 @@ import { genImport, genObjectFromRawEntries, genString } from 'knitwork'
 import escapeRE from 'escape-string-regexp'
 import { joinURL } from 'ufo'
 import type { NuxtApp, NuxtPage } from 'nuxt/schema'
-import VueRouter from 'unplugin-vue-router/vite'
+import VueRouterVite from 'unplugin-vue-router/vite'
+import VueRouterWebpack from 'unplugin-vue-router/webpack'
 import {
   createRoutesContext
 } from 'unplugin-vue-router'
@@ -103,11 +104,14 @@ export default defineNuxtModule({
       }
 
       addVitePlugin(
-        VueRouter(options),
+        VueRouterVite(options),
         {
           prepend: true
         }
       )
+      addWebpackPlugin(
+        VueRouterWebpack(options)
+      )
       nuxt.hook('prepare:types', ({ references }) => {
         references.push({ path: './typed-router.d.ts' })
       })

From c32738f86cefea82e85da9416bfe7f018bf2f4a8 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 15:01:20 +0100
Subject: [PATCH 17/52] fix: use buildDir

---
 packages/nuxt/src/pages/module.ts | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index b9da19551930..a1b0507b0dcb 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -83,10 +83,8 @@ export default defineNuxtModule({
     if (useExperimentalTypedPages) {
       console.log('📄 Adding pages module')
       const options: _UVROptions = {
-
         routesFolder: pagesDirs,
-        // FIXME: find the root of the project
-        dts: resolve(nuxt.options.srcDir, '.nuxt/typed-router.d.ts'),
+        dts: resolve(nuxt.options.buildDir, 'typed-router.d.ts'),
         logs: true,
         extendRoute (route) {
           // TODO: refactor names and types conditionally

From a0e5574e798a27c15fc5776e6bd0500e20425aae Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 15:24:29 +0100
Subject: [PATCH 18/52] refactor: use `RouterLinkProps` to benefit from typings
 (later)

---
 packages/nuxt/src/app/components/nuxt-link.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/nuxt/src/app/components/nuxt-link.ts b/packages/nuxt/src/app/components/nuxt-link.ts
index 1cecf11c05ab..8965af1e0b34 100644
--- a/packages/nuxt/src/app/components/nuxt-link.ts
+++ b/packages/nuxt/src/app/components/nuxt-link.ts
@@ -7,7 +7,7 @@ import { onNuxtReady } from '../composables/ready'
 import { navigateTo, useRouter } from '../composables/router'
 import { useNuxtApp } from '../nuxt'
 import { cancelIdleCallback, requestIdleCallback } from '../compat/idle-callback'
-import type { RouteLocation, RouteLocationRaw } from '#vue-router'
+import type { RouteLocation, RouteLocationRaw, RouterLinkProps } from '#vue-router'
 
 const firstNonUndefined = <T> (...args: (T | undefined)[]) => args.find(arg => arg !== undefined)
 
@@ -24,8 +24,8 @@ export type NuxtLinkOptions = {
 
 export type NuxtLinkProps = {
   // Routing
-  to?: string | RouteLocationRaw
-  href?: string | RouteLocationRaw
+  to?: RouterLinkProps['to']
+  href?: RouterLinkProps['to']
   external?: boolean
   replace?: boolean
   custom?: boolean

From 1591bb1021d636de96ee29853cda6aaba48bb5fd Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 16:09:02 +0100
Subject: [PATCH 19/52] chore: update lockfile

---
 pnpm-lock.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ff259f825410..7785ae003ebe 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -2906,7 +2906,7 @@ packages:
       '@vue/shared': 3.3.0-alpha.12
       estree-walker: 2.0.2
       magic-string: 0.30.0
-      postcss: 8.4.21
+      postcss: 8.4.22
       source-map-js: 1.0.2
     dev: false
 

From 51db0dc3ee393d70676151ea9ce5345e1bf5fe71 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 16:13:24 +0100
Subject: [PATCH 20/52] style: lint

---
 .eslintrc                                         | 4 ++++
 packages/nuxt/src/app/components/nuxt-link.ts     | 3 ++-
 packages/nuxt/src/app/composables/preload.ts      | 4 +++-
 packages/nuxt/src/app/composables/router.ts       | 3 ++-
 packages/nuxt/src/app/nuxt.ts                     | 3 ++-
 packages/nuxt/src/pages/module.ts                 | 4 ++--
 packages/nuxt/src/pages/runtime/page.ts           | 5 +++--
 packages/nuxt/src/pages/runtime/plugins/router.ts | 3 ++-
 8 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/.eslintrc b/.eslintrc
index c4a7c5d9b371..89525a0c9cc9 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -41,6 +41,10 @@
           {
             "pattern": "@nuxt/test-utils",
             "group": "external"
+          },
+          {
+            "pattern": "#vue-router",
+            "group": "external"
           }
         ]
       }
diff --git a/packages/nuxt/src/app/components/nuxt-link.ts b/packages/nuxt/src/app/components/nuxt-link.ts
index 8965af1e0b34..d633a34087f5 100644
--- a/packages/nuxt/src/app/components/nuxt-link.ts
+++ b/packages/nuxt/src/app/components/nuxt-link.ts
@@ -2,12 +2,13 @@ import type { ComputedRef, DefineComponent, PropType } from 'vue'
 import { computed, defineComponent, h, onBeforeUnmount, onMounted, ref, resolveComponent } from 'vue'
 import { hasProtocol, parseQuery, parseURL, withTrailingSlash, withoutTrailingSlash } from 'ufo'
 
+import type { RouteLocation, RouteLocationRaw, RouterLinkProps } from '#vue-router'
+
 import { preloadRouteComponents } from '../composables/preload'
 import { onNuxtReady } from '../composables/ready'
 import { navigateTo, useRouter } from '../composables/router'
 import { useNuxtApp } from '../nuxt'
 import { cancelIdleCallback, requestIdleCallback } from '../compat/idle-callback'
-import type { RouteLocation, RouteLocationRaw, RouterLinkProps } from '#vue-router'
 
 const firstNonUndefined = <T> (...args: (T | undefined)[]) => args.find(arg => arg !== undefined)
 
diff --git a/packages/nuxt/src/app/composables/preload.ts b/packages/nuxt/src/app/composables/preload.ts
index 6c47cc67c825..02be795d5591 100644
--- a/packages/nuxt/src/app/composables/preload.ts
+++ b/packages/nuxt/src/app/composables/preload.ts
@@ -1,7 +1,9 @@
 import type { Component } from 'vue'
+
+import type { RouteLocationRaw, Router } from '#vue-router'
+
 import { useNuxtApp } from '../nuxt'
 import { useRouter } from './router'
-import type { RouteLocationRaw, Router } from '#vue-router'
 
 /**
  * Preload a component or components that have been globally registered.
diff --git a/packages/nuxt/src/app/composables/router.ts b/packages/nuxt/src/app/composables/router.ts
index 80c9d20d4038..47f3cb379476 100644
--- a/packages/nuxt/src/app/composables/router.ts
+++ b/packages/nuxt/src/app/composables/router.ts
@@ -3,11 +3,12 @@ import type { Ref } from 'vue'
 import { sendRedirect } from 'h3'
 import { hasProtocol, joinURL, parseURL } from 'ufo'
 
+import type { NavigationFailure, NavigationGuard, RouteLocationNormalized, RouteLocationPathRaw, RouteLocationRaw, Router, useRoute as _useRoute, useRouter as _useRouter } from '#vue-router'
+
 import { useNuxtApp, useRuntimeConfig } from '../nuxt'
 import type { NuxtError } from './error'
 import { createError } from './error'
 import { useState } from './state'
-import type { NavigationFailure, NavigationGuard, RouteLocationNormalized, RouteLocationPathRaw, RouteLocationRaw, Router, useRoute as _useRoute, useRouter as _useRouter } from '#vue-router'
 
 import type { PageMeta } from '#app'
 
diff --git a/packages/nuxt/src/app/nuxt.ts b/packages/nuxt/src/app/nuxt.ts
index 6f1a1adac243..afb47150d903 100644
--- a/packages/nuxt/src/app/nuxt.ts
+++ b/packages/nuxt/src/app/nuxt.ts
@@ -8,11 +8,12 @@ import type { SSRContext } from 'vue-bundle-renderer/runtime'
 import type { H3Event } from 'h3'
 import type { AppConfig, AppConfigInput, RuntimeConfig } from 'nuxt/schema'
 
+import type { RouteLocationNormalizedLoaded } from '#vue-router'
+
 // eslint-disable-next-line import/no-restricted-paths
 import type { NuxtIslandContext } from '../core/runtime/nitro/renderer'
 import type { RouteMiddleware } from '../../app'
 import type { NuxtError } from '../app/composables/error'
-import type { RouteLocationNormalizedLoaded } from '#vue-router'
 
 const nuxtAppCtx = /* #__PURE__ */ getContext<NuxtApp>('nuxt-app')
 
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index a1b0507b0dcb..908083f28dc9 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -416,7 +416,7 @@ import type { EditableTreeNode } from 'unplugin-vue-router'
         `
 export * from '${vueRouterPath}'
 ` + (fromAuto
-          ? `\
+        ? `\
 declare module '@nuxt/schema' {
   export interface NuxtHooks {
     'pages:extendOne': (page: EditableTreeNode) => HookResult;
@@ -424,7 +424,7 @@ declare module '@nuxt/schema' {
   }
 }
 `
-          : '')
+        : '')
     }
   })
 }
diff --git a/packages/nuxt/src/pages/runtime/page.ts b/packages/nuxt/src/pages/runtime/page.ts
index 2836fb9ab82a..62ea05181edf 100644
--- a/packages/nuxt/src/pages/runtime/page.ts
+++ b/packages/nuxt/src/pages/runtime/page.ts
@@ -2,10 +2,11 @@ import { Suspense, Transition, computed, defineComponent, h, nextTick, onMounted
 import type { KeepAliveProps, TransitionProps, VNode } from 'vue'
 import { defu } from 'defu'
 
-import type { RouterViewSlotProps } from './utils'
-import { generateRouteKey, wrapInKeepAlive } from './utils'
 import type { RouteLocation, RouteLocationNormalized, RouteLocationNormalizedLoaded } from '#vue-router'
 import { RouterView } from '#vue-router'
+
+import type { RouterViewSlotProps } from './utils'
+import { generateRouteKey, wrapInKeepAlive } from './utils'
 import { useNuxtApp } from '#app/nuxt'
 import { _wrapIf } from '#app/components/utils'
 // @ts-expect-error virtual file
diff --git a/packages/nuxt/src/pages/runtime/plugins/router.ts b/packages/nuxt/src/pages/runtime/plugins/router.ts
index 5d80c95018be..b05c8316828e 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router.ts
@@ -3,7 +3,6 @@ import type { Ref } from 'vue'
 import { createError } from 'h3'
 import { withoutBase } from 'ufo'
 
-import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
 import {
   createMemoryHistory,
   createRouter,
@@ -12,6 +11,8 @@ import {
 } from '#vue-router'
 import type { RouteLocation, Router } from '#vue-router'
 
+import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
+
 import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'
 import { clearError, showError, useError } from '#app/composables/error'
 import { useState } from '#app/composables/state'

From 2af7b9a3fc3237d1942b314f3760fe311e5e6348 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 16:16:59 +0100
Subject: [PATCH 21/52] style: reduce visible diff

---
 packages/nuxt/src/app/components/nuxt-link.ts     |  3 +--
 packages/nuxt/src/app/composables/preload.ts      |  2 --
 packages/nuxt/src/app/composables/router.ts       |  3 +--
 packages/nuxt/src/app/nuxt.ts                     |  3 +--
 packages/nuxt/src/core/nuxt.ts                    |  6 +-----
 packages/nuxt/src/pages/module.ts                 | 13 ++++---------
 packages/nuxt/src/pages/runtime/page.ts           |  3 +--
 packages/nuxt/src/pages/runtime/plugins/router.ts |  1 -
 packages/nuxt/src/pages/runtime/router.options.ts |  2 +-
 9 files changed, 10 insertions(+), 26 deletions(-)

diff --git a/packages/nuxt/src/app/components/nuxt-link.ts b/packages/nuxt/src/app/components/nuxt-link.ts
index d633a34087f5..1774be795111 100644
--- a/packages/nuxt/src/app/components/nuxt-link.ts
+++ b/packages/nuxt/src/app/components/nuxt-link.ts
@@ -1,8 +1,7 @@
 import type { ComputedRef, DefineComponent, PropType } from 'vue'
 import { computed, defineComponent, h, onBeforeUnmount, onMounted, ref, resolveComponent } from 'vue'
-import { hasProtocol, parseQuery, parseURL, withTrailingSlash, withoutTrailingSlash } from 'ufo'
-
 import type { RouteLocation, RouteLocationRaw, RouterLinkProps } from '#vue-router'
+import { hasProtocol, parseQuery, parseURL, withTrailingSlash, withoutTrailingSlash } from 'ufo'
 
 import { preloadRouteComponents } from '../composables/preload'
 import { onNuxtReady } from '../composables/ready'
diff --git a/packages/nuxt/src/app/composables/preload.ts b/packages/nuxt/src/app/composables/preload.ts
index 02be795d5591..6710ae2b8210 100644
--- a/packages/nuxt/src/app/composables/preload.ts
+++ b/packages/nuxt/src/app/composables/preload.ts
@@ -1,7 +1,5 @@
 import type { Component } from 'vue'
-
 import type { RouteLocationRaw, Router } from '#vue-router'
-
 import { useNuxtApp } from '../nuxt'
 import { useRouter } from './router'
 
diff --git a/packages/nuxt/src/app/composables/router.ts b/packages/nuxt/src/app/composables/router.ts
index 47f3cb379476..3a4796e0e1c0 100644
--- a/packages/nuxt/src/app/composables/router.ts
+++ b/packages/nuxt/src/app/composables/router.ts
@@ -1,10 +1,9 @@
 import { getCurrentInstance, inject, onUnmounted } from 'vue'
 import type { Ref } from 'vue'
+import type { NavigationFailure, NavigationGuard, RouteLocationNormalized, RouteLocationPathRaw, RouteLocationRaw, Router, useRoute as _useRoute, useRouter as _useRouter } from '#vue-router'
 import { sendRedirect } from 'h3'
 import { hasProtocol, joinURL, parseURL } from 'ufo'
 
-import type { NavigationFailure, NavigationGuard, RouteLocationNormalized, RouteLocationPathRaw, RouteLocationRaw, Router, useRoute as _useRoute, useRouter as _useRouter } from '#vue-router'
-
 import { useNuxtApp, useRuntimeConfig } from '../nuxt'
 import type { NuxtError } from './error'
 import { createError } from './error'
diff --git a/packages/nuxt/src/app/nuxt.ts b/packages/nuxt/src/app/nuxt.ts
index afb47150d903..eb6fdad0e55a 100644
--- a/packages/nuxt/src/app/nuxt.ts
+++ b/packages/nuxt/src/app/nuxt.ts
@@ -1,6 +1,7 @@
 /* eslint-disable no-use-before-define */
 import { getCurrentInstance, reactive } from 'vue'
 import type { App, Ref, VNode, onErrorCaptured } from 'vue'
+import type { RouteLocationNormalizedLoaded } from '#vue-router'
 import type { HookCallback, Hookable } from 'hookable'
 import { createHooks } from 'hookable'
 import { getContext } from 'unctx'
@@ -8,8 +9,6 @@ import type { SSRContext } from 'vue-bundle-renderer/runtime'
 import type { H3Event } from 'h3'
 import type { AppConfig, AppConfigInput, RuntimeConfig } from 'nuxt/schema'
 
-import type { RouteLocationNormalizedLoaded } from '#vue-router'
-
 // eslint-disable-next-line import/no-restricted-paths
 import type { NuxtIslandContext } from '../core/runtime/nitro/renderer'
 import type { RouteMiddleware } from '../../app'
diff --git a/packages/nuxt/src/core/nuxt.ts b/packages/nuxt/src/core/nuxt.ts
index 27f56698869a..638fd6a29ba2 100644
--- a/packages/nuxt/src/core/nuxt.ts
+++ b/packages/nuxt/src/core/nuxt.ts
@@ -358,11 +358,7 @@ export async function loadNuxt (opts: LoadNuxtOptions): Promise<Nuxt> {
   // Temporary until finding better placement for each
   options.appDir = options.alias['#app'] = resolve(distDir, 'app')
   options._majorVersion = 3
-  options._modules.push(
-    pagesModule,
-    metaModule,
-    componentsModule
-  )
+  options._modules.push(pagesModule, metaModule, componentsModule)
   options._modules.push([importsModule, {
     transform: {
       include: options._layers
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 908083f28dc9..7dccae360b6a 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -7,14 +7,9 @@ import { joinURL } from 'ufo'
 import type { NuxtApp, NuxtPage } from 'nuxt/schema'
 import VueRouterVite from 'unplugin-vue-router/vite'
 import VueRouterWebpack from 'unplugin-vue-router/webpack'
-import {
-  createRoutesContext
-} from 'unplugin-vue-router'
+import { createRoutesContext } from 'unplugin-vue-router'
 import { resolveOptions } from 'unplugin-vue-router/options'
-import type {
-  EditableTreeNode,
-  Options as _UVROptions
-} from 'unplugin-vue-router'
+import type { EditableTreeNode, Options as _UVROption } from 'unplugin-vue-router'
 
 import { distDir } from '../dirs'
 import { normalizeRoutes, resolvePagesRoutes } from './utils'
@@ -416,7 +411,7 @@ import type { EditableTreeNode } from 'unplugin-vue-router'
         `
 export * from '${vueRouterPath}'
 ` + (fromAuto
-        ? `\
+          ? `\
 declare module '@nuxt/schema' {
   export interface NuxtHooks {
     'pages:extendOne': (page: EditableTreeNode) => HookResult;
@@ -424,7 +419,7 @@ declare module '@nuxt/schema' {
   }
 }
 `
-        : '')
+          : '')
     }
   })
 }
diff --git a/packages/nuxt/src/pages/runtime/page.ts b/packages/nuxt/src/pages/runtime/page.ts
index 62ea05181edf..7e971a36526f 100644
--- a/packages/nuxt/src/pages/runtime/page.ts
+++ b/packages/nuxt/src/pages/runtime/page.ts
@@ -1,9 +1,8 @@
 import { Suspense, Transition, computed, defineComponent, h, nextTick, onMounted, provide, reactive } from 'vue'
 import type { KeepAliveProps, TransitionProps, VNode } from 'vue'
+import { RouterView } from '#vue-router'
 import { defu } from 'defu'
-
 import type { RouteLocation, RouteLocationNormalized, RouteLocationNormalizedLoaded } from '#vue-router'
-import { RouterView } from '#vue-router'
 
 import type { RouterViewSlotProps } from './utils'
 import { generateRouteKey, wrapInKeepAlive } from './utils'
diff --git a/packages/nuxt/src/pages/runtime/plugins/router.ts b/packages/nuxt/src/pages/runtime/plugins/router.ts
index b05c8316828e..e76e7a7f8324 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router.ts
@@ -12,7 +12,6 @@ import {
 import type { RouteLocation, Router } from '#vue-router'
 
 import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
-
 import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'
 import { clearError, showError, useError } from '#app/composables/error'
 import { useState } from '#app/composables/state'
diff --git a/packages/nuxt/src/pages/runtime/router.options.ts b/packages/nuxt/src/pages/runtime/router.options.ts
index 4a24e45f2235..1c5df83f3a25 100644
--- a/packages/nuxt/src/pages/runtime/router.options.ts
+++ b/packages/nuxt/src/pages/runtime/router.options.ts
@@ -1,6 +1,6 @@
+import type { RouteLocationNormalized, RouterScrollBehavior } from '#vue-router'
 import { nextTick } from 'vue'
 import type { RouterConfig } from 'nuxt/schema'
-import type { RouteLocationNormalized, RouterScrollBehavior } from '#vue-router'
 import { useNuxtApp } from '#app/nuxt'
 // @ts-expect-error virtual file
 import { appPageTransition as defaultPageTransition } from '#build/nuxt.config.mjs'

From 5484cd844a472a0915315743e404f2b762e939ae Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Wed, 19 Apr 2023 15:18:53 +0000
Subject: [PATCH 22/52] [autofix.ci] apply automated fixes

---
 packages/nuxt/src/pages/module.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 7dccae360b6a..cde723a8c081 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -411,7 +411,7 @@ import type { EditableTreeNode } from 'unplugin-vue-router'
         `
 export * from '${vueRouterPath}'
 ` + (fromAuto
-          ? `\
+        ? `\
 declare module '@nuxt/schema' {
   export interface NuxtHooks {
     'pages:extendOne': (page: EditableTreeNode) => HookResult;
@@ -419,7 +419,7 @@ declare module '@nuxt/schema' {
   }
 }
 `
-          : '')
+        : '')
     }
   })
 }

From e22dd0258a6c9a8254e65ff6ba6ff845f1f92123 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 16:28:45 +0100
Subject: [PATCH 23/52] fix: add todo note

---
 packages/nuxt/src/pages/module.ts | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index cde723a8c081..37c7239cf612 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -8,8 +8,9 @@ import type { NuxtApp, NuxtPage } from 'nuxt/schema'
 import VueRouterVite from 'unplugin-vue-router/vite'
 import VueRouterWebpack from 'unplugin-vue-router/webpack'
 import { createRoutesContext } from 'unplugin-vue-router'
+// @ts-expect-error TODO: expose subpath using named exports
 import { resolveOptions } from 'unplugin-vue-router/options'
-import type { EditableTreeNode, Options as _UVROption } from 'unplugin-vue-router'
+import type { EditableTreeNode, Options as _UVROptions } from 'unplugin-vue-router'
 
 import { distDir } from '../dirs'
 import { normalizeRoutes, resolvePagesRoutes } from './utils'
@@ -411,7 +412,7 @@ import type { EditableTreeNode } from 'unplugin-vue-router'
         `
 export * from '${vueRouterPath}'
 ` + (fromAuto
-        ? `\
+          ? `\
 declare module '@nuxt/schema' {
   export interface NuxtHooks {
     'pages:extendOne': (page: EditableTreeNode) => HookResult;
@@ -419,7 +420,7 @@ declare module '@nuxt/schema' {
   }
 }
 `
-        : '')
+          : '')
     }
   })
 }

From ab80137231abb84b25c8f2b3bf307cdac0718276 Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Wed, 19 Apr 2023 15:31:49 +0000
Subject: [PATCH 24/52] [autofix.ci] apply automated fixes

---
 packages/nuxt/src/pages/module.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 37c7239cf612..96802f677aeb 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -412,7 +412,7 @@ import type { EditableTreeNode } from 'unplugin-vue-router'
         `
 export * from '${vueRouterPath}'
 ` + (fromAuto
-          ? `\
+        ? `\
 declare module '@nuxt/schema' {
   export interface NuxtHooks {
     'pages:extendOne': (page: EditableTreeNode) => HookResult;
@@ -420,7 +420,7 @@ declare module '@nuxt/schema' {
   }
 }
 `
-          : '')
+        : '')
     }
   })
 }

From 2e34a3b703e7f35aa50434cbf6ab4077955cda65 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 22:37:16 +0100
Subject: [PATCH 25/52] fix(nuxt): use different syntax to keep type in build

---
 packages/nuxt/src/pages/runtime/plugins/router.ts | 6 ++++--
 pnpm-lock.yaml                                    | 2 +-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/nuxt/src/pages/runtime/plugins/router.ts b/packages/nuxt/src/pages/runtime/plugins/router.ts
index e76e7a7f8324..c5598dc8469f 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router.ts
@@ -45,7 +45,7 @@ function createCurrentLocation (
   return path + search + hash
 }
 
-export default defineNuxtPlugin({
+const plugin: Plugin<{ router: Router }> = defineNuxtPlugin({
   name: 'nuxt:router',
   enforce: 'pre',
   async setup (nuxtApp) {
@@ -202,4 +202,6 @@ export default defineNuxtPlugin({
 
     return { provide: { router } }
   }
-}) as Plugin<{ router: Router }>
+})
+
+export default plugin
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6df7a89ac91f..2a3226b6d51e 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -3157,7 +3157,7 @@ packages:
       '@vue/shared': 3.3.0-alpha.12
       estree-walker: 2.0.2
       magic-string: 0.30.0
-      postcss: 8.4.22
+      postcss: 8.4.23
       source-map-js: 1.0.2
     dev: false
 

From dc34ed900ee00074a55f8a47f099d10fbfe124d4 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 23:27:09 +0100
Subject: [PATCH 26/52] chore: use minor constraint

---
 packages/nuxt/package.json | 2 +-
 pnpm-lock.yaml             | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json
index 8a90dda9aaf1..8d1734bb777b 100644
--- a/packages/nuxt/package.json
+++ b/packages/nuxt/package.json
@@ -92,7 +92,7 @@
     "unenv": "^1.4.1",
     "unimport": "^3.0.6",
     "unplugin": "^1.3.1",
-    "unplugin-vue-router": "^0.5.5",
+    "unplugin-vue-router": "~0.5.5",
     "untyped": "^1.3.2",
     "vue": "^3.2.47",
     "vue-bundle-renderer": "^1.0.3",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 2a3226b6d51e..b59400a37abc 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -672,7 +672,7 @@ importers:
         specifier: ^1.3.1
         version: 1.3.1
       unplugin-vue-router:
-        specifier: ^0.5.5
+        specifier: ~0.5.5
         version: 0.5.5(rollup@3.20.2)(vue-router@4.1.6)(vue@3.2.47)
       untyped:
         specifier: ^1.3.2

From 2c5b6c42928ca9207710ab07c0e1248a56a1bf6c Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 23:28:19 +0100
Subject: [PATCH 27/52] chore: minimise diff

---
 packages/nuxt/src/pages/runtime/plugins/router.ts | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/packages/nuxt/src/pages/runtime/plugins/router.ts b/packages/nuxt/src/pages/runtime/plugins/router.ts
index c5598dc8469f..f494323ce26a 100644
--- a/packages/nuxt/src/pages/runtime/plugins/router.ts
+++ b/packages/nuxt/src/pages/runtime/plugins/router.ts
@@ -1,15 +1,14 @@
 import { computed, isReadonly, reactive, shallowRef } from 'vue'
 import type { Ref } from 'vue'
-import { createError } from 'h3'
-import { withoutBase } from 'ufo'
-
+import type { RouteLocation, Router } from '#vue-router'
 import {
   createMemoryHistory,
   createRouter,
   createWebHashHistory,
   createWebHistory
 } from '#vue-router'
-import type { RouteLocation, Router } from '#vue-router'
+import { createError } from 'h3'
+import { withoutBase } from 'ufo'
 
 import type { PageMeta, Plugin, RouteMiddleware } from '../../../app/index'
 import { callWithNuxt, defineNuxtPlugin, useRuntimeConfig } from '#app/nuxt'

From ebbe8800583dfe4e609dc1e625d7617ef112f8e3 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 23:36:03 +0100
Subject: [PATCH 28/52] refactor: move templates into module

---
 packages/nuxt/src/pages/module.ts | 60 +++++++++++++------------------
 1 file changed, 24 insertions(+), 36 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 96802f677aeb..efcb292561bb 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -23,6 +23,7 @@ export default defineNuxtModule({
   },
   async setup (_options, nuxt) {
     const useExperimentalTypedPages = nuxt.options.experimental.typedPages
+    const vueRouterPath = useExperimentalTypedPages ? 'vue-router/auto' : 'vue-router'
 
     const pagesDirs = nuxt.options._layers.map(
       layer => resolve(layer.config.srcDir, layer.config.dir?.pages || 'pages')
@@ -277,8 +278,29 @@ export default defineNuxtModule({
       }
     })
 
-    // adds support to #vue-router
-    addBuildTimeVueRouter(useExperimentalTypedPages)
+    // adds support for #vue-router alias
+    addTemplate({
+      filename: 'vue-router.mjs',
+      getContents () {
+        return `export * from '${vueRouterPath}';`
+      }
+    })
+    addTemplate({
+      filename: 'vue-router.d.ts',
+      getContents () {
+        return [
+          useExperimentalTypedPages && 'import type { EditableTreeNode } from \'unplugin-vue-router\'',
+          `export * from '${vueRouterPath}'`,
+          useExperimentalTypedPages && `
+declare module '@nuxt/schema' {
+  export interface NuxtHooks {
+    'pages:extendOne': (page: EditableTreeNode) => HookResult;
+    'pages:beforeWrite': (rootPage: EditableTreeNode) => HookResult;
+  }
+}`
+        ].filter(Boolean).join('\n')
+      }
+    })
 
     // Add routes template
     addTemplate({
@@ -390,37 +412,3 @@ export default defineNuxtModule({
     })
   }
 })
-
-function addBuildTimeVueRouter (fromAuto: boolean) {
-  const vueRouterPath = fromAuto ? 'vue-router/auto' : 'vue-router'
-  addTemplate({
-    filename: 'vue-router.mjs',
-    getContents () {
-      return `export * from '${vueRouterPath}';`
-    }
-  })
-  addTemplate({
-    filename: 'vue-router.d.ts',
-    getContents () {
-      return '' +
-        (fromAuto
-          ? `\
-import type { EditableTreeNode } from 'unplugin-vue-router'
-`
-          : '') +
-
-        `
-export * from '${vueRouterPath}'
-` + (fromAuto
-        ? `\
-declare module '@nuxt/schema' {
-  export interface NuxtHooks {
-    'pages:extendOne': (page: EditableTreeNode) => HookResult;
-    'pages:beforeWrite': (rootPage: EditableTreeNode) => HookResult;
-  }
-}
-`
-        : '')
-    }
-  })
-}

From 21f537643daa2161d71a586cd03a6f2633afd894 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 23:36:10 +0100
Subject: [PATCH 29/52] refactor: move to types folder

---
 packages/nuxt/src/pages/module.ts | 23 ++++++++---------------
 1 file changed, 8 insertions(+), 15 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index efcb292561bb..04781e534d5a 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -81,7 +81,7 @@ export default defineNuxtModule({
       console.log('📄 Adding pages module')
       const options: _UVROptions = {
         routesFolder: pagesDirs,
-        dts: resolve(nuxt.options.buildDir, 'typed-router.d.ts'),
+        dts: resolve(nuxt.options.buildDir, 'types/typed-router.d.ts'),
         logs: true,
         extendRoute (route) {
           // TODO: refactor names and types conditionally
@@ -94,24 +94,17 @@ export default defineNuxtModule({
         }
       }
 
+      nuxt.hook('prepare:types', ({ references }) => {
+        references.push({ path: './types/typed-router.d.ts' })
+      })
+
       if (nuxt.options._prepare) {
         await createRoutesContext(resolveOptions(options)).scanPages(false)
       }
 
-      addVitePlugin(
-        VueRouterVite(options),
-        {
-          prepend: true
-        }
-      )
-      addWebpackPlugin(
-        VueRouterWebpack(options)
-      )
-      nuxt.hook('prepare:types', ({ references }) => {
-        references.push({ path: './typed-router.d.ts' })
-      })
-
-      // FIXME: add webpack plugin as well
+      addVitePlugin(VueRouterVite(options), { prepend: true })
+      // @ts-expect-error TODO: https://github.com/nuxt/nuxt/pull/20403
+      addWebpackPlugin(VueRouterWebpack(options), { prepend: true })
     }
 
     const runtimeDir = resolve(distDir, 'pages/runtime')

From 9708b7c52507fe499a38fc5ffe3219fc54d12176 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 19 Apr 2023 23:39:06 +0100
Subject: [PATCH 30/52] refactor: more small changes

---
 packages/nuxt/src/pages/module.ts | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 04781e534d5a..81b940e43897 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -118,7 +118,7 @@ export default defineNuxtModule({
     nuxt.hook('imports:sources', (sources) => {
       const routerImports = sources.find(s => s.from === '#app' && s.imports.includes('onBeforeRouteLeave'))
       if (routerImports) {
-        routerImports.from = useExperimentalTypedPages ? 'vue-router/auto' : 'vue-router'
+        routerImports.from = vueRouterPath
       }
     })
 
@@ -207,11 +207,7 @@ export default defineNuxtModule({
     nuxt.hook('imports:extend', (imports) => {
       imports.push(
         { name: 'definePageMeta', as: 'definePageMeta', from: resolve(runtimeDir, 'composables') },
-        {
-          name: 'useLink',
-          as: 'useLink',
-          from: useExperimentalTypedPages ? 'vue-router/auto' : 'vue-router'
-        }
+        { name: 'useLink', as: 'useLink', from: vueRouterPath }
       )
     })
 
@@ -300,14 +296,13 @@ declare module '@nuxt/schema' {
       filename: 'routes.mjs',
       async getContents () {
         if (useExperimentalTypedPages) {
-          console.log('👉 routes.mjs')
           return "export { routes as default } from 'vue-router/auto/routes';"
-        } else {
-          const pages = await resolvePagesRoutes()
-          await nuxt.callHook('pages:extend', pages)
-          const { routes, imports } = normalizeRoutes(pages)
-          return [...imports, `export default ${routes}`].join('\n')
         }
+
+        const pages = await resolvePagesRoutes()
+        await nuxt.callHook('pages:extend', pages)
+        const { routes, imports } = normalizeRoutes(pages)
+        return [...imports, `export default ${routes}`].join('\n')
       }
     })
 

From 5c164a53b99df32561c7bab3ac3744ad70ae17ef Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 26 Apr 2023 11:02:11 +0100
Subject: [PATCH 31/52] test: add type fixture

---
 test/fixtures/basic/nuxt.config.ts |  1 +
 test/fixtures/basic/types.ts       | 59 +++++++++++++++++++++++++++++-
 2 files changed, 59 insertions(+), 1 deletion(-)

diff --git a/test/fixtures/basic/nuxt.config.ts b/test/fixtures/basic/nuxt.config.ts
index cda954f1aec0..1f2a56e88a58 100644
--- a/test/fixtures/basic/nuxt.config.ts
+++ b/test/fixtures/basic/nuxt.config.ts
@@ -186,6 +186,7 @@ export default defineNuxtConfig({
     }
   },
   experimental: {
+    typedPages: true,
     polyfillVueUseHead: true,
     renderJsonPayloads: process.env.TEST_PAYLOAD !== 'js',
     respectNoSSRHeader: true,
diff --git a/test/fixtures/basic/types.ts b/test/fixtures/basic/types.ts
index 15985c74965e..3dc3106af87f 100644
--- a/test/fixtures/basic/types.ts
+++ b/test/fixtures/basic/types.ts
@@ -7,7 +7,7 @@ import type { AppConfig, RuntimeValue } from 'nuxt/schema'
 import { defineNuxtConfig } from 'nuxt/config'
 import { callWithNuxt, isVue3 } from '#app'
 import type { NavigateToOptions } from '#app/composables/router'
-import { NuxtPage } from '#components'
+import { NuxtLink, NuxtPage } from '#components'
 import { useRouter } from '#imports'
 
 interface TestResponse { message: string }
@@ -107,6 +107,63 @@ describe('middleware', () => {
   })
 })
 
+describe('typed router integration', () => {
+  it('allows typing useRouter', () => {
+    const router = useRouter()
+    // @ts-expect-error this named route does not exist
+    router.push({ name: 'some-thing' })
+    // this one does
+    router.push({ name: 'fixed-keyed-child-parent' })
+    // @ts-expect-error this route needs an id
+    router.push({ name: 'random-id' })
+    router.push({ name: 'random-id', params: { id: 4 } })
+  })
+
+  it('allows typing useRoute', () => {
+    const route = useRoute('random-id')
+    // @ts-expect-error this param does not exist
+    const _invalid = route.params.something
+    // this param does
+    const _valid = route.params.id
+  })
+
+  it('allows typing navigateTo', () => {
+    // @ts-expect-error this named route does not exist
+    navigateTo({ name: 'some-thing' })
+    // this one does
+    navigateTo({ name: 'fixed-keyed-child-parent' })
+    // @ts-expect-error this route needs an id
+    navigateTo({ name: 'random-id' })
+    navigateTo({ name: 'random-id', params: { id: 4 } })
+  })
+
+  it('allows typing middleware', () => {
+    defineNuxtRouteMiddleware((to) => {
+      expectTypeOf(to.name).not.toBeAny()
+      // @ts-expect-error this route does not exist
+      expectTypeOf(to.name === 'bob').toMatchTypeOf<boolean>()
+      expectTypeOf(to.name === 'assets').toMatchTypeOf<boolean>()
+    })
+  })
+
+  it('respects pages:extend augmentation', () => {
+    // added via pages:extend
+    expectTypeOf(useRoute().name === 'internal-async-parent').toMatchTypeOf<boolean>()
+    // @ts-expect-error this route does not exist
+    expectTypeOf(useRoute().name === 'invalid').toMatchTypeOf<boolean>()
+  })
+
+  it('allows typing NuxtLink', () => {
+    // @ts-expect-error this named route does not exist
+    h(NuxtLink, { to: { name: 'some-thing' } })
+    // this one does
+    h(NuxtLink, { to: { name: 'fixed-keyed-child-parent' } })
+    // @ts-expect-error this route needs an id
+    h(NuxtLink, { to: { name: 'random-id' } })
+    h(NuxtLink, { to: { name: 'random-id', params: { id: 4 } } })
+  })
+})
+
 describe('layouts', () => {
   it('recognizes named layouts', () => {
     definePageMeta({ layout: 'custom' })

From 4c19b4b2357d8f81c2ceaee90373a22abc0c803c Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 26 Apr 2023 11:02:18 +0100
Subject: [PATCH 32/52] chore: update lockfile

---
 pnpm-lock.yaml | 62 +++++++++++++++++++++++++-------------------------
 1 file changed, 31 insertions(+), 31 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1e5803b1c52e..e97e77c441e3 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -676,7 +676,7 @@ importers:
         version: 1.3.1
       unplugin-vue-router:
         specifier: ~0.5.5
-        version: 0.5.5(rollup@3.20.2)(vue-router@4.1.6)(vue@3.2.47)
+        version: 0.5.5(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47)
       untyped:
         specifier: ^1.3.2
         version: 1.3.2
@@ -3060,7 +3060,7 @@ packages:
       '@volar/vue-language-core': 1.4.4
       typescript: 5.0.4
 
-  /@vue-macros/common@1.2.0(rollup@3.20.2)(vue@3.2.47):
+  /@vue-macros/common@1.2.0(rollup@3.21.0)(vue@3.2.47):
     resolution: {integrity: sha512-lQglnRn+8wkdAhmGQbrI0mo4SzRuY5KBjst0qi8LBDYllFKtI2brapbewUME1AXnXbVett0SRDnB2EdZXyzCmw==}
     engines: {node: '>=14.19.0'}
     peerDependencies:
@@ -3070,8 +3070,8 @@ packages:
         optional: true
     dependencies:
       '@babel/types': 7.21.4
-      '@rollup/pluginutils': 5.0.2(rollup@3.20.2)
-      '@vue/compiler-sfc': 3.3.0-alpha.12
+      '@rollup/pluginutils': 5.0.2(rollup@3.21.0)
+      '@vue/compiler-sfc': 3.3.0-beta.2
       local-pkg: 0.4.3
       magic-string-ast: 0.1.2
       vue: 3.2.47
@@ -3106,11 +3106,11 @@ packages:
       estree-walker: 2.0.2
       source-map: 0.6.1
 
-  /@vue/compiler-core@3.3.0-alpha.12:
-    resolution: {integrity: sha512-jAcjlvNR5e+rZ8nzJ8S3t6vpINctQhnLEjqeubvPRPgIRxnzAl6NzWgOCfqz81WO8tRoyYXyN5YF5lEyj+Ku2Q==}
+  /@vue/compiler-core@3.3.0-beta.2:
+    resolution: {integrity: sha512-Z2VZCL9Rr1gVgyALHIRP+lNFjgfs/K4aTxvJYQ2vhgEAaI0/L6wtG5sr/gOP+MgxwGQV0PvA+iDG3Y3PC7rTEg==}
     dependencies:
       '@babel/parser': 7.21.4
-      '@vue/shared': 3.3.0-alpha.12
+      '@vue/shared': 3.3.0-beta.2
       estree-walker: 2.0.2
       source-map-js: 1.0.2
     dev: false
@@ -3121,11 +3121,11 @@ packages:
       '@vue/compiler-core': 3.2.47
       '@vue/shared': 3.2.47
 
-  /@vue/compiler-dom@3.3.0-alpha.12:
-    resolution: {integrity: sha512-jti83D32xoyAIkvPwf3V1c/r4K498OZpJxEJCUYizsr9WAN1vI1Mm85JKTFF/phH7CDu7wqxALx/uti6SsnEtA==}
+  /@vue/compiler-dom@3.3.0-beta.2:
+    resolution: {integrity: sha512-9LPRdCj66OwmUiPa9nuKiaoyKxlFT56j+io8nK/aW5OLl1UkY//Lj661fmDkTY20oLmArt73fAuHD913w4hRqA==}
     dependencies:
-      '@vue/compiler-core': 3.3.0-alpha.12
-      '@vue/shared': 3.3.0-alpha.12
+      '@vue/compiler-core': 3.3.0-beta.2
+      '@vue/shared': 3.3.0-beta.2
     dev: false
 
   /@vue/compiler-sfc@3.2.47:
@@ -3142,15 +3142,15 @@ packages:
       postcss: 8.4.23
       source-map: 0.6.1
 
-  /@vue/compiler-sfc@3.3.0-alpha.12:
-    resolution: {integrity: sha512-JevlKXtRuvwl5iTgCyCxOVD9Bge9Ck4pnOY03V1Vikx+Smtf/QIqJI/XMK2aFxgoPXUBj3/ueqy9kz6yW2CgNQ==}
+  /@vue/compiler-sfc@3.3.0-beta.2:
+    resolution: {integrity: sha512-5FmcQ5LIpM/Y22dTxnxWPD04jC2gr6XSVVqQNY0y776F1P9x4f06fIpMibL58aKU07Th2z4Ab3oPg/Cg1QNVmA==}
     dependencies:
       '@babel/parser': 7.21.4
-      '@vue/compiler-core': 3.3.0-alpha.12
-      '@vue/compiler-dom': 3.3.0-alpha.12
-      '@vue/compiler-ssr': 3.3.0-alpha.12
-      '@vue/reactivity-transform': 3.3.0-alpha.12
-      '@vue/shared': 3.3.0-alpha.12
+      '@vue/compiler-core': 3.3.0-beta.2
+      '@vue/compiler-dom': 3.3.0-beta.2
+      '@vue/compiler-ssr': 3.3.0-beta.2
+      '@vue/reactivity-transform': 3.3.0-beta.2
+      '@vue/shared': 3.3.0-beta.2
       estree-walker: 2.0.2
       magic-string: 0.30.0
       postcss: 8.4.23
@@ -3163,11 +3163,11 @@ packages:
       '@vue/compiler-dom': 3.2.47
       '@vue/shared': 3.2.47
 
-  /@vue/compiler-ssr@3.3.0-alpha.12:
-    resolution: {integrity: sha512-PlitVo8v+rzQ9SxTqY+88N0kOEWbgsRj5oGrgxcACEJxt5oLvKm6eIJuFtwm4im/QtUk3SqMLTKRqTZ+CVywbg==}
+  /@vue/compiler-ssr@3.3.0-beta.2:
+    resolution: {integrity: sha512-Xg9od6GvHwfEpnTxMQR+KlKG1nbOHWRLHCiSA0FENiSDTjCDHh0ClzZLhIZUZJD75miyE9ia5ZQF6vpw680rCw==}
     dependencies:
-      '@vue/compiler-dom': 3.3.0-alpha.12
-      '@vue/shared': 3.3.0-alpha.12
+      '@vue/compiler-dom': 3.3.0-beta.2
+      '@vue/shared': 3.3.0-beta.2
     dev: false
 
   /@vue/devtools-api@6.5.0:
@@ -3182,12 +3182,12 @@ packages:
       estree-walker: 2.0.2
       magic-string: 0.30.0
 
-  /@vue/reactivity-transform@3.3.0-alpha.12:
-    resolution: {integrity: sha512-t+vK8WOK8NXLpl6YBOpGh3sTx54j6G2NQsWjFFEv4BEMYtrPYTZswFRfT6eth8eY4X5jI5np/vHGUMCaUnf3BA==}
+  /@vue/reactivity-transform@3.3.0-beta.2:
+    resolution: {integrity: sha512-EUL53/rsd+hrqhCa/SrhXQ6PzMZJfLQt39xQlzr0Sxsdv/bg5lqbcK9YtGkjYohRuSp1QneFU78LEsQ9j4B2Dw==}
     dependencies:
       '@babel/parser': 7.21.4
-      '@vue/compiler-core': 3.3.0-alpha.12
-      '@vue/shared': 3.3.0-alpha.12
+      '@vue/compiler-core': 3.3.0-beta.2
+      '@vue/shared': 3.3.0-beta.2
       estree-walker: 2.0.2
       magic-string: 0.30.0
     dev: false
@@ -3222,8 +3222,8 @@ packages:
   /@vue/shared@3.2.47:
     resolution: {integrity: sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ==}
 
-  /@vue/shared@3.3.0-alpha.12:
-    resolution: {integrity: sha512-5Kw7f53F+Vxl8F61fsrTg056mhhHchDmSK8fRdHlfuEuNz2EICi8ehaD+0A3PMo+Zd/S9OBhkOyG4oI6g+O9PA==}
+  /@vue/shared@3.3.0-beta.2:
+    resolution: {integrity: sha512-AsHYKYiYUnL/LHog6iV/G9tctFZYOsaxHDbSnfeyip94rjndO46XSDbHek7wDlcj3NHGaf8jAQQKfva/7mypjA==}
     dev: false
 
   /@vueuse/core@9.13.0(vue@3.2.47):
@@ -9349,7 +9349,7 @@ packages:
       - vite
     dev: true
 
-  /unplugin-vue-router@0.5.5(rollup@3.20.2)(vue-router@4.1.6)(vue@3.2.47):
+  /unplugin-vue-router@0.5.5(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47):
     resolution: {integrity: sha512-4ymcsmCXD5vBs7I+8bZbBVgt+qGP8myIsWmLLABFj70qqOc+dXoNLwH7jMS16dnxeKb816GHz2ZhG73qzQCoJg==}
     peerDependencies:
       vue-router: ^4.1.0
@@ -9358,8 +9358,8 @@ packages:
         optional: true
     dependencies:
       '@babel/types': 7.21.4
-      '@rollup/pluginutils': 5.0.2(rollup@3.20.2)
-      '@vue-macros/common': 1.2.0(rollup@3.20.2)(vue@3.2.47)
+      '@rollup/pluginutils': 5.0.2(rollup@3.21.0)
+      '@vue-macros/common': 1.2.0(rollup@3.21.0)(vue@3.2.47)
       ast-walker-scope: 0.4.1
       chokidar: 3.5.3
       fast-glob: 3.2.12

From d19ddf2293db6d56dbdd54a424c924f18c33d9f1 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 26 Apr 2023 12:06:15 +0100
Subject: [PATCH 33/52] refactor: use native nuxt + `pages:extend` rather than
 unplugin hooks

---
 packages/nuxt/src/build-vue-router.d.ts  |  13 ---
 packages/nuxt/src/pages/EditableRoute.ts | 105 ------------------
 packages/nuxt/src/pages/module.ts        | 133 ++++++++---------------
 3 files changed, 48 insertions(+), 203 deletions(-)
 delete mode 100644 packages/nuxt/src/build-vue-router.d.ts
 delete mode 100644 packages/nuxt/src/pages/EditableRoute.ts

diff --git a/packages/nuxt/src/build-vue-router.d.ts b/packages/nuxt/src/build-vue-router.d.ts
deleted file mode 100644
index 2cfe1dedd9c6..000000000000
--- a/packages/nuxt/src/build-vue-router.d.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-/**
- * This file adds module hooks for typed router support.
- */
-
-import type { EditableTreeNode, HookResult } from 'unplugin-vue-router/types'
-// to have type errors during dev
-declare module '@nuxt/schema' {
-  export interface NuxtHooks {
-    'pages:extendOne': (page: EditableTreeNode) => HookResult
-    'pages:beforeWrite': (rootPage: EditableTreeNode) => HookResult
-  }
-}
-
diff --git a/packages/nuxt/src/pages/EditableRoute.ts b/packages/nuxt/src/pages/EditableRoute.ts
deleted file mode 100644
index 47fb8e74ec8b..000000000000
--- a/packages/nuxt/src/pages/EditableRoute.ts
+++ /dev/null
@@ -1,105 +0,0 @@
-import type { NuxtPage } from '@nuxt/schema'
-import type { EditableTreeNode } from 'unplugin-vue-router'
-
-/**
- * TODO: after checking https://github.dev/intlify/routing we need to ensure that a module author can set the children of a route with the following properties:
-  - name?: string
-  - path: string
-  - file?: string // for nuxt bridge & nuxt 3
-  - children?: Route[]
- */
-
-export class NuxtPageEditable {
-  private _node: EditableTreeNode
-  private _children: NuxtPage[]
-
-  constructor (node: EditableTreeNode) {
-    this._node = node
-    this._children = createChildrenProxy(node)
-  }
-
-  get name () {
-    return this._node.name
-  }
-
-  set name (name: string) {
-    this._node.name = name
-  }
-
-  // TODO: is it fullPath or path?
-  get path () {
-    return this._node.path
-  }
-
-  // TODO: is it fullPath or path?
-  set path (path: string) {
-    this._node.path = path
-  }
-
-  get file () {
-    return this._node.components.get('default')
-  }
-
-  set file (file: string | undefined) {
-    if (!file) {
-      this._node.components.delete('default')
-    } else {
-      this._node.components.set('default', file)
-    }
-  }
-
-  // FIXME: I need to create a proxy on children array to work with splice and other functions
-
-  get children (): NuxtPage[] {
-    return this._children
-  }
-
-  set children (routes: NuxtPage[]) {
-    // TODO: remove all children then add the new ones
-    throw new Error('Not implemented')
-  }
-}
-
-function createChildrenProxy (node: EditableTreeNode): NuxtPage[] {
-  const target: NuxtPage[] = node.children.map(n => new NuxtPageEditable(n))
-
-  console.log('🪄 proxified')
-  const self = new Proxy<NuxtPage[]>(target, {
-    get (target, p, receiver) {
-      if (p === 'push') {
-        function push (target: NuxtPage[], ...routes: NuxtPage[]) {
-          console.log('🪄 push()', routes)
-          routes.forEach((route) => {
-            const routeNode = node.insert(route.path, route.path)
-            const nuxtPage = new NuxtPageEditable(routeNode)
-            routeNode.name = route.name
-            // FIXME: add once made writable
-            // routeNode.alias = route.alias
-            if (route.meta) {
-              routeNode.addToMeta(route.meta)
-            }
-            // FIXME: implement
-            // routeNode.redirect = route.redirect
-            // .... others
-            if (route.file) {
-              console.log('🪄 set file', route.file)
-              routeNode.components.set('default', route.file)
-            }
-            route.children?.forEach((child) => {
-              // FIXME:
-              push(nuxtPage.children, child)
-            })
-
-            return target.push(nuxtPage)
-          })
-        }
-
-        return push.bind(null, target)
-      }
-
-      return Reflect.get(target, p, receiver)
-    }
-  })
-
-  return self
-}
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 81b940e43897..e8bc46e63107 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -10,7 +10,7 @@ import VueRouterWebpack from 'unplugin-vue-router/webpack'
 import { createRoutesContext } from 'unplugin-vue-router'
 // @ts-expect-error TODO: expose subpath using named exports
 import { resolveOptions } from 'unplugin-vue-router/options'
-import type { EditableTreeNode, Options as _UVROptions } from 'unplugin-vue-router'
+import type { EditableTreeNode, Options as TypedRouterOptions } from 'unplugin-vue-router'
 
 import { distDir } from '../dirs'
 import { normalizeRoutes, resolvePagesRoutes } from './utils'
@@ -76,26 +76,40 @@ export default defineNuxtModule({
       return
     }
 
-    let rootPage: EditableTreeNode | undefined
     if (useExperimentalTypedPages) {
-      console.log('📄 Adding pages module')
-      const options: _UVROptions = {
-        routesFolder: pagesDirs,
-        dts: resolve(nuxt.options.buildDir, 'types/typed-router.d.ts'),
+      const declarationFile = './types/typed-router.d.ts'
+      const options: TypedRouterOptions = {
+        routesFolder: [],
+        dts: resolve(nuxt.options.buildDir, declarationFile),
         logs: true,
-        extendRoute (route) {
-          // TODO: refactor names and types conditionally
-          return nuxt.callHook('pages:extendOne', route)
-        },
-        async beforeWriteFiles (_rootPage) {
-          await nuxt.callHook('pages:beforeWrite', _rootPage)
-          await nuxt.callHook('pages:extend', [..._rootPage])
-          rootPage = _rootPage
+        async beforeWriteFiles (rootPage) {
+          const pages = await resolvePagesRoutes()
+          await nuxt.callHook('pages:extend', pages)
+          function addPage (parent: EditableTreeNode, page: NuxtPage) {
+            const route = parent.insert(page.path, page.file)
+            if (page.meta) {
+              route.addToMeta(page.meta)
+            }
+            if (page.alias) {
+              route.addAlias(page.alias)
+            }
+            if (page.name) {
+              route.name = page.name
+            }
+            if (page.children) {
+              page.children.forEach(child => addPage(route, child))
+            }
+          }
+
+          for (const page of pages) {
+            addPage(rootPage, page)
+          }
         }
       }
 
       nuxt.hook('prepare:types', ({ references }) => {
-        references.push({ path: './types/typed-router.d.ts' })
+        // This file will be generated by unplugin-vue-router
+        references.push({ path: declarationFile })
       })
 
       if (nuxt.options._prepare) {
@@ -131,8 +145,7 @@ export default defineNuxtModule({
       ].filter(Boolean)
 
       const pathPattern = new RegExp(`(^|\\/)(${dirs.map(escapeRE).join('|')})/`)
-      // TODO: can we remove this since the template is now just a re-export?
-      if (event !== 'change' && path.match(pathPattern)) {
+      if (!useExperimentalTypedPages && event !== 'change' && path.match(pathPattern)) {
         await updateTemplates({
           filter: template => template.filename === 'routes.mjs'
         })
@@ -155,43 +168,21 @@ export default defineNuxtModule({
     if (!nuxt.options.dev && nuxt.options._generate) {
       const prerenderRoutes = new Set<string>()
       nuxt.hook('modules:done', () => {
-        // TODO: this should be doable within the unplugin
-        if (useExperimentalTypedPages) {
+        nuxt.hook('pages:extend', (pages) => {
           prerenderRoutes.clear()
-          if (!rootPage) {
-            // FIXME:
-            throw new Error('Can this ever happen?')
-          }
-
-          // FIXME: this requires some code on the unplugin side
-          for (const page of rootPage) {
-            // if page has no children (is leaf) and has an optional param or a catch all param at the end, add
-            if (!page.isPassThrough &&
-              // does it no required params
-              !page.params.some(p => !p.optional)
-              // && any optional param is located at the end
-            ) {
-              prerenderRoutes.add(page.fullPath)
+          const processPages = (pages: NuxtPage[], currentPath = '/') => {
+            for (const page of pages) {
+              // Add root of optional dynamic paths and catchalls
+              if (page.path.match(/^\/?:.*(\?|\(\.\*\)\*)$/) && !page.children?.length) { prerenderRoutes.add(currentPath) }
+              // Skip dynamic paths
+              if (page.path.includes(':')) { continue }
+              const route = joinURL(currentPath, page.path)
+              prerenderRoutes.add(route)
+              if (page.children) { processPages(page.children, route) }
             }
           }
-        } else {
-          // Legacy pages:extend
-          nuxt.hook('pages:extend', (pages) => {
-            prerenderRoutes.clear()
-            const processPages = (pages: NuxtPage[], currentPath = '/') => {
-              for (const page of pages) {
-                // Add root of optional dynamic paths and catchalls
-                if (page.path.match(/^\/?:.*(\?|\(\.\*\)\*)$/) && !page.children?.length) { prerenderRoutes.add(currentPath) }
-                // Skip dynamic paths
-                if (page.path.includes(':')) { continue }
-                const route = joinURL(currentPath, page.path)
-                prerenderRoutes.add(route)
-                if (page.children) { processPages(page.children, route) }
-              }
-            }
-            processPages(pages)
-          })
-        }
+          processPages(pages)
+        })
       })
       nuxt.hook('nitro:build:before', (nitro) => {
         for (const route of nitro.options.prerender.routes || []) {
@@ -240,24 +231,10 @@ export default defineNuxtModule({
     // Do not prefetch page chunks
     nuxt.hook('build:manifest', async (manifest) => {
       if (nuxt.options.dev) { return }
-      console.log('👉 build:manifest')
-      // const pages = await resolvePagesRoutes()
-      // await nuxt.callHook('pages:extend', pages)
-
-      // TODO: do we need the paths to be relative or can they be absolute?
-      // NOTE: they used to be relative to the project root
-      let sourceFiles: string[]
-      sourceFiles = [...(rootPage || [])]
-        .map(p => p.components.get('default'))
-        .filter((v: unknown): v is string => !!v)
-        .map(p => relative(nuxt.options.srcDir, p))
-
-      // unplugin-vue-router already generates the routes before this hook
-      if (!useExperimentalTypedPages) {
-        const pages = await resolvePagesRoutes()
-        await nuxt.callHook('pages:extend', pages)
-        sourceFiles = getSources(pages)
-      }
+      const pages = await resolvePagesRoutes()
+      await nuxt.callHook('pages:extend', pages)
+
+      const sourceFiles = getSources(pages)
 
       for (const key in manifest) {
         if (manifest[key].isEntry) {
@@ -270,25 +247,11 @@ export default defineNuxtModule({
     // adds support for #vue-router alias
     addTemplate({
       filename: 'vue-router.mjs',
-      getContents () {
-        return `export * from '${vueRouterPath}';`
-      }
+      getContents: () => `export * from '${vueRouterPath}';`
     })
     addTemplate({
       filename: 'vue-router.d.ts',
-      getContents () {
-        return [
-          useExperimentalTypedPages && 'import type { EditableTreeNode } from \'unplugin-vue-router\'',
-          `export * from '${vueRouterPath}'`,
-          useExperimentalTypedPages && `
-declare module '@nuxt/schema' {
-  export interface NuxtHooks {
-    'pages:extendOne': (page: EditableTreeNode) => HookResult;
-    'pages:beforeWrite': (rootPage: EditableTreeNode) => HookResult;
-  }
-}`
-        ].filter(Boolean).join('\n')
-      }
+      getContents: () => `export * from '${vueRouterPath}'`
     })
 
     // Add routes template

From edfdad4edb72f7342cf4d02444b2b9b3a68404ca Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 26 Apr 2023 14:12:18 +0100
Subject: [PATCH 34/52] chore: ignore type error

---
 packages/nuxt/src/pages/module.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index e8bc46e63107..97da22e57424 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -86,6 +86,8 @@ export default defineNuxtModule({
           const pages = await resolvePagesRoutes()
           await nuxt.callHook('pages:extend', pages)
           function addPage (parent: EditableTreeNode, page: NuxtPage) {
+            // @ts-expect-error TODO: either fix types upstream or figure out another
+            // way to add a route without a file, which must be possible
             const route = parent.insert(page.path, page.file)
             if (page.meta) {
               route.addToMeta(page.meta)

From 35fbd6befe4c7216cfddbd2f7b9c66a6dd68c2cc Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Wed, 26 Apr 2023 14:32:43 +0100
Subject: [PATCH 35/52] chore: add `page.redirect`

---
 packages/nuxt/src/pages/module.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 97da22e57424..6bbed541b452 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -98,6 +98,8 @@ export default defineNuxtModule({
             if (page.name) {
               route.name = page.name
             }
+            // TODO: implement redirect support
+            // if (page.redirect) {}
             if (page.children) {
               page.children.forEach(child => addPage(route, child))
             }

From 25830a2825b97de069acb279b068091cfb19068a Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva@users.noreply.github.com>
Date: Mon, 1 May 2023 09:54:23 +0200
Subject: [PATCH 36/52] Update packages/kit/src/build.ts [skip ci]

Co-authored-by: Oscar Lee-Vermeren <oscar.leevermeren@gmail.com>
---
 packages/kit/src/build.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/kit/src/build.ts b/packages/kit/src/build.ts
index e6c6ff073881..fb634bbffcf3 100644
--- a/packages/kit/src/build.ts
+++ b/packages/kit/src/build.ts
@@ -34,7 +34,7 @@ export interface ExtendWebpackConfigOptions extends ExtendConfigOptions {
 
 export interface ExtendViteConfigOptions extends ExtendConfigOptions {
   /**
-   * Prepends the plugin to the array with `unshit()` instead of `push()`. In practice this shouldn't be necessary, but
+   * Prepends the plugin to the array with `unshift()` instead of `push()`. In practice this shouldn't be necessary, but
    * it's needed by unplugin-vue-router until vue exposes an API to parse files.
    * @internal
    */

From 8c64788287f11f5118d108a939f1a74fcd87af8b Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Mon, 1 May 2023 10:53:18 +0100
Subject: [PATCH 37/52] chore: update unplugin version

---
 packages/nuxt/package.json | 2 +-
 pnpm-lock.yaml             | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json
index 9dc6a9b622b9..db1bb0622ed1 100644
--- a/packages/nuxt/package.json
+++ b/packages/nuxt/package.json
@@ -93,7 +93,7 @@
     "unenv": "^1.4.1",
     "unimport": "^3.0.6",
     "unplugin": "^1.3.1",
-    "unplugin-vue-router": "~0.5.5",
+    "unplugin-vue-router": "~0.6.2",
     "untyped": "^1.3.2",
     "vue": "^3.2.47",
     "vue-bundle-renderer": "^1.0.3",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e97e77c441e3..ea479633c427 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -675,8 +675,8 @@ importers:
         specifier: ^1.3.1
         version: 1.3.1
       unplugin-vue-router:
-        specifier: ~0.5.5
-        version: 0.5.5(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47)
+        specifier: ~0.6.2
+        version: 0.6.2(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47)
       untyped:
         specifier: ^1.3.2
         version: 1.3.2
@@ -9349,8 +9349,8 @@ packages:
       - vite
     dev: true
 
-  /unplugin-vue-router@0.5.5(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47):
-    resolution: {integrity: sha512-4ymcsmCXD5vBs7I+8bZbBVgt+qGP8myIsWmLLABFj70qqOc+dXoNLwH7jMS16dnxeKb816GHz2ZhG73qzQCoJg==}
+  /unplugin-vue-router@0.6.2(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47):
+    resolution: {integrity: sha512-tQI3UklB6AGSXenrGuJfyvuCIAUg70/M3YmSnqfFGzAXe+OxN4R+KAp+vHJY5PWRlvYWnNKw735gXFF9lMjoPA==}
     peerDependencies:
       vue-router: ^4.1.0
     peerDependenciesMeta:

From 2dbee98bd846116ce9bbc6371280be1d96d7c9b4 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Mon, 1 May 2023 10:56:18 +0100
Subject: [PATCH 38/52] fix: remove customisations to kit utils

---
 packages/kit/src/build.ts         | 10 +---------
 packages/nuxt/src/pages/module.ts |  1 -
 2 files changed, 1 insertion(+), 10 deletions(-)

diff --git a/packages/kit/src/build.ts b/packages/kit/src/build.ts
index d206128be758..1ad1ad8b4f76 100644
--- a/packages/kit/src/build.ts
+++ b/packages/kit/src/build.ts
@@ -35,14 +35,7 @@ export interface ExtendConfigOptions {
 
 export interface ExtendWebpackConfigOptions extends ExtendConfigOptions {}
 
-export interface ExtendViteConfigOptions extends ExtendConfigOptions {
-  /**
-   * Prepends the plugin to the array with `unshift()` instead of `push()`. In practice this shouldn't be necessary, but
-   * it's needed by unplugin-vue-router until vue exposes an API to parse files.
-   * @internal
-   */
-  prepend?: boolean
-}
+export interface ExtendViteConfigOptions extends ExtendConfigOptions {}
 
 /**
  * Extend webpack config
@@ -131,7 +124,6 @@ export function addWebpackPlugin (plugin: WebpackPluginInstance | WebpackPluginI
 export function addVitePlugin (plugin: VitePlugin | VitePlugin[], options?: ExtendViteConfigOptions) {
   const method: 'push' | 'unshift' = options?.prepend ? 'unshift' : 'push'
   extendViteConfig((config) => {
-    const method: 'push' | 'unshift' = options?.prepend ? 'unshift' : 'push'
     config.plugins = config.plugins || []
     if (Array.isArray(plugin)) {
       config.plugins[method](...plugin)
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 6bbed541b452..fa19afe0db30 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -121,7 +121,6 @@ export default defineNuxtModule({
       }
 
       addVitePlugin(VueRouterVite(options), { prepend: true })
-      // @ts-expect-error TODO: https://github.com/nuxt/nuxt/pull/20403
       addWebpackPlugin(VueRouterWebpack(options), { prepend: true })
     }
 

From 8d6fdf9b34e55ea771958300f62bcc10b1bfa601 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Mon, 1 May 2023 11:11:34 +0100
Subject: [PATCH 39/52] fix: workaround for dts generation time

---
 packages/nuxt/src/pages/module.ts | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index fa19afe0db30..48f50c417754 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -1,4 +1,5 @@
 import { existsSync, readdirSync } from 'node:fs'
+import { readFile } from 'node:fs/promises'
 import { addComponent, addPlugin, addTemplate, addVitePlugin, addWebpackPlugin, defineNuxtModule, findPath, updateTemplates } from '@nuxt/kit'
 import { join, relative, resolve } from 'pathe'
 import { genImport, genObjectFromRawEntries, genString } from 'knitwork'
@@ -8,7 +9,6 @@ import type { NuxtApp, NuxtPage } from 'nuxt/schema'
 import VueRouterVite from 'unplugin-vue-router/vite'
 import VueRouterWebpack from 'unplugin-vue-router/webpack'
 import { createRoutesContext } from 'unplugin-vue-router'
-// @ts-expect-error TODO: expose subpath using named exports
 import { resolveOptions } from 'unplugin-vue-router/options'
 import type { EditableTreeNode, Options as TypedRouterOptions } from 'unplugin-vue-router'
 
@@ -117,7 +117,14 @@ export default defineNuxtModule({
       })
 
       if (nuxt.options._prepare) {
-        await createRoutesContext(resolveOptions(options)).scanPages(false)
+        const context = createRoutesContext(resolveOptions(options))
+        await context.scanPages()
+        // TODO: could we generate this from context instead?
+        const dts = await readFile(join(nuxt.options.buildDir, 'types/typed-router.d.ts'), 'utf-8')
+        addTemplate({
+          filename: 'types/typed-router.d.ts',
+          getContents: () => dts
+        })
       }
 
       addVitePlugin(VueRouterVite(options), { prepend: true })

From a837c24778241a8fdc76c7cd32373c3fa9894cad Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Mon, 1 May 2023 11:29:09 +0100
Subject: [PATCH 40/52] fix: create directory first

---
 packages/nuxt/src/pages/module.ts | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 48f50c417754..4cb71eea930a 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -1,7 +1,7 @@
 import { existsSync, readdirSync } from 'node:fs'
-import { readFile } from 'node:fs/promises'
+import { mkdir, readFile } from 'node:fs/promises'
 import { addComponent, addPlugin, addTemplate, addVitePlugin, addWebpackPlugin, defineNuxtModule, findPath, updateTemplates } from '@nuxt/kit'
-import { join, relative, resolve } from 'pathe'
+import { dirname, join, relative, resolve } from 'pathe'
 import { genImport, genObjectFromRawEntries, genString } from 'knitwork'
 import escapeRE from 'escape-string-regexp'
 import { joinURL } from 'ufo'
@@ -118,9 +118,11 @@ export default defineNuxtModule({
 
       if (nuxt.options._prepare) {
         const context = createRoutesContext(resolveOptions(options))
+        const dtsFile = resolve(nuxt.options.buildDir, declarationFile)
+        await mkdir(dirname(dtsFile), { recursive: true })
         await context.scanPages()
         // TODO: could we generate this from context instead?
-        const dts = await readFile(join(nuxt.options.buildDir, 'types/typed-router.d.ts'), 'utf-8')
+        const dts = await readFile(dtsFile, 'utf-8')
         addTemplate({
           filename: 'types/typed-router.d.ts',
           getContents: () => dts

From a78b7978542eaefbfe0423655c3399851fd7f6dc Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 14:31:27 +0100
Subject: [PATCH 41/52] chore: bump unplugin version

---
 packages/nuxt/package.json | 2 +-
 pnpm-lock.yaml             | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json
index da2a9f21ad7a..403a694cabf8 100644
--- a/packages/nuxt/package.json
+++ b/packages/nuxt/package.json
@@ -94,7 +94,7 @@
     "unenv": "^1.4.1",
     "unimport": "^3.0.6",
     "unplugin": "^1.3.1",
-    "unplugin-vue-router": "~0.6.2",
+    "unplugin-vue-router": "~0.6.3",
     "untyped": "^1.3.2",
     "vue": "^3.2.47",
     "vue-bundle-renderer": "^1.0.3",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index bbc0ab2b225c..3b21a66f24ef 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -687,8 +687,8 @@ importers:
         specifier: ^1.3.1
         version: 1.3.1
       unplugin-vue-router:
-        specifier: ~0.6.2
-        version: 0.6.2(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47)
+        specifier: ~0.6.3
+        version: 0.6.3(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47)
       untyped:
         specifier: ^1.3.2
         version: 1.3.2
@@ -9291,8 +9291,8 @@ packages:
       - vite
     dev: true
 
-  /unplugin-vue-router@0.6.2(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47):
-    resolution: {integrity: sha512-tQI3UklB6AGSXenrGuJfyvuCIAUg70/M3YmSnqfFGzAXe+OxN4R+KAp+vHJY5PWRlvYWnNKw735gXFF9lMjoPA==}
+  /unplugin-vue-router@0.6.3(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47):
+    resolution: {integrity: sha512-Gljn3TGRdBcfQpJPnUEaFltHkZDRKp/4uE2lGMlsbBpCK8wFdHzIP3iRj5RL1ISYtK9FHGv+kEwFhLNe0/ab8w==}
     peerDependencies:
       vue-router: ^4.1.0
     peerDependenciesMeta:

From 9350e93000b4b655c89c59edea16ff6cbf46862f Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 15:25:55 +0100
Subject: [PATCH 42/52] fix: use unplugin just for types, not for router

---
 packages/nuxt/src/pages/module.ts | 17 ++++++-----------
 1 file changed, 6 insertions(+), 11 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index dd7f2d4a8041..66be372a485b 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -23,7 +23,6 @@ export default defineNuxtModule({
   },
   async setup (_options, nuxt) {
     const useExperimentalTypedPages = nuxt.options.experimental.typedPages
-    const vueRouterPath = useExperimentalTypedPages ? 'vue-router/auto' : 'vue-router'
 
     const pagesDirs = nuxt.options._layers.map(
       layer => resolve(layer.config.srcDir, layer.config.dir?.pages || 'pages')
@@ -144,7 +143,7 @@ export default defineNuxtModule({
     nuxt.hook('imports:sources', (sources) => {
       const routerImports = sources.find(s => s.from === '#app' && s.imports.includes('onBeforeRouteLeave'))
       if (routerImports) {
-        routerImports.from = vueRouterPath
+        routerImports.from = '#vue-router'
       }
     })
 
@@ -157,7 +156,7 @@ export default defineNuxtModule({
       ].filter(Boolean)
 
       const pathPattern = new RegExp(`(^|\\/)(${dirs.map(escapeRE).join('|')})/`)
-      if (!useExperimentalTypedPages && event !== 'change' && path.match(pathPattern)) {
+      if (event !== 'change' && path.match(pathPattern)) {
         await updateTemplates({
           filter: template => template.filename === 'routes.mjs'
         })
@@ -210,7 +209,7 @@ export default defineNuxtModule({
     nuxt.hook('imports:extend', (imports) => {
       imports.push(
         { name: 'definePageMeta', as: 'definePageMeta', from: resolve(runtimeDir, 'composables') },
-        { name: 'useLink', as: 'useLink', from: vueRouterPath }
+        { name: 'useLink', as: 'useLink', from: '#vue-router' }
       )
     })
 
@@ -223,7 +222,6 @@ export default defineNuxtModule({
       )
     }
     nuxt.hook('modules:done', () => {
-      // TODO: fix broken definePageMeta() with unplugin-vue-router
       addVitePlugin(() => PageMetaPlugin.vite(pageMetaOptions))
       addWebpackPlugin(() => PageMetaPlugin.webpack(pageMetaOptions))
     })
@@ -259,21 +257,18 @@ export default defineNuxtModule({
     // adds support for #vue-router alias
     addTemplate({
       filename: 'vue-router.mjs',
-      getContents: () => `export * from '${vueRouterPath}';`
+      // TODO: use `vue-router/auto` when we have support for page metadata
+      getContents: () => 'export * from \'vue-router\';'
     })
     addTemplate({
       filename: 'vue-router.d.ts',
-      getContents: () => `export * from '${vueRouterPath}'`
+      getContents: () => `export * from '${useExperimentalTypedPages ? 'vue-router/auto' : 'vue-router'}'`
     })
 
     // Add routes template
     addTemplate({
       filename: 'routes.mjs',
       async getContents () {
-        if (useExperimentalTypedPages) {
-          return "export { routes as default } from 'vue-router/auto/routes';"
-        }
-
         const pages = await resolvePagesRoutes()
         await nuxt.callHook('pages:extend', pages)
         const { routes, imports } = normalizeRoutes(pages)

From 10ea7e7171d103594cab1ff609f8394949fed777 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 15:29:44 +0100
Subject: [PATCH 43/52] fix: use `RouteLocationRaw` directly for nuxtlink props

---
 packages/nuxt/src/app/components/nuxt-link.ts | 10 +++++-----
 test/fixtures/basic/types.ts                  |  4 ++--
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/nuxt/src/app/components/nuxt-link.ts b/packages/nuxt/src/app/components/nuxt-link.ts
index 5c6e1fc3f1af..a78ff6a79d2b 100644
--- a/packages/nuxt/src/app/components/nuxt-link.ts
+++ b/packages/nuxt/src/app/components/nuxt-link.ts
@@ -1,6 +1,6 @@
 import type { ComputedRef, DefineComponent, PropType } from 'vue'
 import { computed, defineComponent, h, onBeforeUnmount, onMounted, ref, resolveComponent } from 'vue'
-import type { RouteLocation, RouteLocationRaw, RouterLinkProps } from '#vue-router'
+import type { RouteLocation, RouteLocationRaw } from '#vue-router'
 import { hasProtocol, parseQuery, parseURL, withTrailingSlash, withoutTrailingSlash } from 'ufo'
 
 import { preloadRouteComponents } from '../composables/preload'
@@ -24,8 +24,8 @@ export type NuxtLinkOptions = {
 
 export type NuxtLinkProps = {
   // Routing
-  to?: RouterLinkProps['to']
-  href?: RouterLinkProps['to']
+  to?: RouteLocationRaw
+  href?: RouteLocationRaw
   external?: boolean
   replace?: boolean
   custom?: boolean
@@ -81,12 +81,12 @@ export function defineNuxtLink (options: NuxtLinkOptions) {
     props: {
       // Routing
       to: {
-        type: [String, Object] as PropType<string | RouteLocationRaw>,
+        type: [String, Object] as PropType<RouteLocationRaw>,
         default: undefined,
         required: false
       },
       href: {
-        type: [String, Object] as PropType<string | RouteLocationRaw>,
+        type: [String, Object] as PropType<RouteLocationRaw>,
         default: undefined,
         required: false
       },
diff --git a/test/fixtures/basic/types.ts b/test/fixtures/basic/types.ts
index e2465e68d550..88c55ccd97a4 100644
--- a/test/fixtures/basic/types.ts
+++ b/test/fixtures/basic/types.ts
@@ -1,7 +1,7 @@
 import { describe, expectTypeOf, it } from 'vitest'
 import type { Ref } from 'vue'
 import type { FetchError } from 'ofetch'
-import type { NavigationFailure, RouteLocationNormalizedLoaded, RouteLocationRaw, Router, useRouter as vueUseRouter } from 'vue-router'
+import type { NavigationFailure, RouteLocationNormalizedLoaded, RouteLocationRaw, Router, useRouter as vueUseRouter } from 'vue-router/auto'
 
 import type { AppConfig, RuntimeValue } from 'nuxt/schema'
 import { defineNuxtConfig } from 'nuxt/config'
@@ -96,7 +96,7 @@ describe('middleware', () => {
     addRouteMiddleware('example', (to, from) => {
       expectTypeOf(to).toEqualTypeOf<RouteLocationNormalizedLoaded>()
       expectTypeOf(from).toEqualTypeOf<RouteLocationNormalizedLoaded>()
-      expectTypeOf(navigateTo).toEqualTypeOf <(to: RouteLocationRaw | null | undefined, options ?: NavigateToOptions) => RouteLocationRaw | void | false | Promise<void | NavigationFailure | false>>()
+      expectTypeOf(navigateTo).toEqualTypeOf<(to: RouteLocationRaw | null | undefined, options?: NavigateToOptions) => RouteLocationRaw | void | false | Promise<void | NavigationFailure | false>>()
       navigateTo('/')
       abortNavigation()
       abortNavigation('error string')

From d31b7b7b9204534fb553c1e2884e6afcee5a511c Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 15:31:02 +0100
Subject: [PATCH 44/52] test: test for invalid params, not missing ones

---
 test/fixtures/basic/types.ts | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/test/fixtures/basic/types.ts b/test/fixtures/basic/types.ts
index 88c55ccd97a4..e2687d56076a 100644
--- a/test/fixtures/basic/types.ts
+++ b/test/fixtures/basic/types.ts
@@ -114,8 +114,8 @@ describe('typed router integration', () => {
     router.push({ name: 'some-thing' })
     // this one does
     router.push({ name: 'fixed-keyed-child-parent' })
-    // @ts-expect-error this route needs an id
-    router.push({ name: 'random-id' })
+    // @ts-expect-error this is an invalid param
+    router.push({ name: 'random-id', params: { bob: 23 } })
     router.push({ name: 'random-id', params: { id: 4 } })
   })
 
@@ -132,8 +132,8 @@ describe('typed router integration', () => {
     navigateTo({ name: 'some-thing' })
     // this one does
     navigateTo({ name: 'fixed-keyed-child-parent' })
-    // @ts-expect-error this route needs an id
-    navigateTo({ name: 'random-id' })
+    // @ts-expect-error this is an invalid param
+    navigateTo({ name: 'random-id', params: { bob: 23 } })
     navigateTo({ name: 'random-id', params: { id: 4 } })
   })
 
@@ -158,8 +158,8 @@ describe('typed router integration', () => {
     h(NuxtLink, { to: { name: 'some-thing' } })
     // this one does
     h(NuxtLink, { to: { name: 'fixed-keyed-child-parent' } })
-    // @ts-expect-error this route needs an id
-    h(NuxtLink, { to: { name: 'random-id' } })
+    // @ts-expect-error this is an invalid param
+    h(NuxtLink, { to: { name: 'random-id', params: { bob: 23 } } })
     h(NuxtLink, { to: { name: 'random-id', params: { id: 4 } } })
   })
 })

From 0a970868560b887a2bbe6a0ed2998d05e280abc5 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 15:54:10 +0100
Subject: [PATCH 45/52] test: add typed usage of useRoute throughout suite

---
 test/fixtures/basic/pages/[...slug].vue                 | 5 +++--
 test/fixtures/basic/pages/nested/[foo]/[bar].vue        | 8 ++++++--
 test/fixtures/basic/pages/nested/[foo]/index.vue        | 6 +++++-
 test/fixtures/basic/pages/nested/[foo]/user-[group].vue | 8 ++++++--
 test/fixtures/basic/pages/nuxt-link/trailing-slash.vue  | 2 +-
 test/fixtures/basic/pages/random/[id].vue               | 2 +-
 6 files changed, 22 insertions(+), 9 deletions(-)

diff --git a/test/fixtures/basic/pages/[...slug].vue b/test/fixtures/basic/pages/[...slug].vue
index ee23ccf1ef78..031a5097b339 100644
--- a/test/fixtures/basic/pages/[...slug].vue
+++ b/test/fixtures/basic/pages/[...slug].vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <h1>[...slug].vue</h1>
-    <div>catchall at {{ $route.params.slug[0] }}</div>
+    <div>catchall at {{ route.params.slug?.[0] }}</div>
     <div>Middleware ran: {{ !!($route.meta.override as any)?.includes('extended middleware') }}</div>
   </div>
 </template>
@@ -11,7 +11,8 @@ definePageMeta({
   middleware: ['override'],
   validate: to => to.path !== '/forbidden'
 })
-if (useRoute().path.includes('navigate-some-path')) {
+const route = useRoute('slug')
+if (route.path.includes('navigate-some-path')) {
   throw createError('navigate-some-path setup running')
 }
 </script>
diff --git a/test/fixtures/basic/pages/nested/[foo]/[bar].vue b/test/fixtures/basic/pages/nested/[foo]/[bar].vue
index 2f0a50e69f9b..168f7737dd30 100644
--- a/test/fixtures/basic/pages/nested/[foo]/[bar].vue
+++ b/test/fixtures/basic/pages/nested/[foo]/[bar].vue
@@ -1,7 +1,11 @@
+<script setup lang="ts">
+const route = useRoute('nested-foo-bar')
+</script>
+
 <template>
   <div>
     <div>nested/[foo]/[bar].vue</div>
-    <div>foo: {{ $route.params.foo }}</div>
-    <div>bar: {{ $route.params.bar }}</div>
+    <div>foo: {{ route.params.foo }}</div>
+    <div>bar: {{ route.params.bar }}</div>
   </div>
 </template>
diff --git a/test/fixtures/basic/pages/nested/[foo]/index.vue b/test/fixtures/basic/pages/nested/[foo]/index.vue
index b2ea680a54b9..beab2f220e17 100644
--- a/test/fixtures/basic/pages/nested/[foo]/index.vue
+++ b/test/fixtures/basic/pages/nested/[foo]/index.vue
@@ -1,6 +1,10 @@
+<script setup lang="ts">
+const route = useRoute('nested-foo')
+</script>
+
 <template>
   <div>
     <div>nested/[foo]/index.vue</div>
-    <div>foo: {{ $route.params.foo }}</div>
+    <div>foo: {{ route.params.foo }}</div>
   </div>
 </template>
diff --git a/test/fixtures/basic/pages/nested/[foo]/user-[group].vue b/test/fixtures/basic/pages/nested/[foo]/user-[group].vue
index 027545a80f4d..4a4da9fe55a2 100644
--- a/test/fixtures/basic/pages/nested/[foo]/user-[group].vue
+++ b/test/fixtures/basic/pages/nested/[foo]/user-[group].vue
@@ -1,7 +1,11 @@
+<script setup lang="ts">
+const route = useRoute('nested-foo-user-group')
+</script>
+
 <template>
   <div>
     <div>nested/[foo]/user-[group].vue</div>
-    <div>foo: {{ $route.params.foo }}</div>
-    <div>group: {{ $route.params.group }}</div>
+    <div>foo: {{ route.params.foo }}</div>
+    <div>group: {{ route.params.group }}</div>
   </div>
 </template>
diff --git a/test/fixtures/basic/pages/nuxt-link/trailing-slash.vue b/test/fixtures/basic/pages/nuxt-link/trailing-slash.vue
index a0a22fc8d185..7f3eee7ebeed 100644
--- a/test/fixtures/basic/pages/nuxt-link/trailing-slash.vue
+++ b/test/fixtures/basic/pages/nuxt-link/trailing-slash.vue
@@ -14,7 +14,7 @@ const links = [
   { name: 'nuxt-link-trailing-slash' },
   { query: { 'with-state': 'true' }, state: { foo: 'bar' } },
   { query: { 'without-state': 'true' } }
-]
+] as const
 
 const route = useRoute()
 const windowState = computed(() => {
diff --git a/test/fixtures/basic/pages/random/[id].vue b/test/fixtures/basic/pages/random/[id].vue
index 2a1f24ada723..75eb362f2290 100644
--- a/test/fixtures/basic/pages/random/[id].vue
+++ b/test/fixtures/basic/pages/random/[id].vue
@@ -35,7 +35,7 @@
 </template>
 
 <script setup lang="ts">
-const route = useRoute()
+const route = useRoute('random-id')
 
 const pageKey = 'rand_' + route.params.id
 

From c4111c2baa47d1e38b88505129885098b80af95a Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 15:57:43 +0100
Subject: [PATCH 46/52] chore: restore playground

---
 playground/app.vue              | 23 +++--------------------
 playground/nuxt.config.ts       | 21 ---------------------
 playground/pages/about.vue      |  6 ------
 playground/pages/index.vue      | 21 ---------------------
 playground/pages/users/[id].vue |  9 ---------
 playground/shared/index.ts      |  8 --------
 6 files changed, 3 insertions(+), 85 deletions(-)
 delete mode 100644 playground/pages/about.vue
 delete mode 100644 playground/pages/index.vue
 delete mode 100644 playground/pages/users/[id].vue
 delete mode 100644 playground/shared/index.ts

diff --git a/playground/app.vue b/playground/app.vue
index eb4bb3d735be..17d631007a1b 100644
--- a/playground/app.vue
+++ b/playground/app.vue
@@ -1,28 +1,11 @@
 <script setup lang="ts">
-// FIXME: remove these changes before merging
 </script>
 
 <template>
   <!-- Edit this file to play around with Nuxt but never commit changes! -->
-  <NuxtLink to="/">
-    Home
-  </NuxtLink>
-  |
-  <NuxtLink to="/about">
-    About
-  </NuxtLink>
-  |
-  <RouterLink to="/_new_extend">
-    Added in Nuxt Config
-  </RouterLink>
-  |
-  <RouterLink :to="{ name: '/users/[id]', params: { id: 5 } }">
-    Some User
-  </RouterLink>
-
-  <hr>
-
-  <NuxtPage />
+  <div>
+    Nuxt 3 Playground
+  </div>
 </template>
 
 <style scoped>
diff --git a/playground/nuxt.config.ts b/playground/nuxt.config.ts
index 802e2fdb3fc0..896312f044ed 100644
--- a/playground/nuxt.config.ts
+++ b/playground/nuxt.config.ts
@@ -1,24 +1,3 @@
-import { dirname, resolve } from 'node:path'
-import { fileURLToPath } from 'node:url'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = dirname(__filename)
-
 export default defineNuxtConfig({
-  experimental: {
-    typedPages: true
-  },
 
-  hooks: {
-    'pages:extend' (pages) {
-      console.log(`✅ Calling legacy pages:extend ${pages.length} pages`)
-      console.log(pages.map(page => page.path))
-    },
-    'pages:beforeWrite' (rootPage) {
-      rootPage.insert('_new_extend', resolve(__dirname, './pages/about.vue'))
-    },
-    'pages:extendOne' (page) {
-      console.log('⚙️ extendOne', page.fullPath)
-    }
-  }
 })
diff --git a/playground/pages/about.vue b/playground/pages/about.vue
deleted file mode 100644
index 72305e71016c..000000000000
--- a/playground/pages/about.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-<script lang="ts" setup>
-</script>
-
-<template>
-  <h1>about</h1>
-</template>
diff --git a/playground/pages/index.vue b/playground/pages/index.vue
deleted file mode 100644
index 72f3c6d0656d..000000000000
--- a/playground/pages/index.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<script lang="ts" setup>
-import {
-  //
-  definePage
-  // useRoute
-} from 'vue-router/auto'
-
-const route = useRoute('/')
-
-definePageMeta({
-  alias: '/home'
-})
-definePage({
-  // alias: '/casa'
-})
-</script>
-
-<template>
-  <h1>Index</h1>
-  <p>{{ route.params }}</p>
-</template>
diff --git a/playground/pages/users/[id].vue b/playground/pages/users/[id].vue
deleted file mode 100644
index a89b63f1a8ac..000000000000
--- a/playground/pages/users/[id].vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<script lang="ts" setup>
-const route = useRoute('/users/[id]')
-</script>
-
-<template>
-  <p>
-    user {{ route.params.id }}
-  </p>
-</template>
diff --git a/playground/shared/index.ts b/playground/shared/index.ts
deleted file mode 100644
index b9a727515768..000000000000
--- a/playground/shared/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-export function useSomething () {
-  const router = useRouter()
-
-  // @ts-expect-error: something doesn't exist
-  router.push({ name: 'something' })
-
-  router.push({ name: '/' })
-}

From 1c2f2633d93ef9928e0ad914ac5293d52c1540b7 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 16:17:59 +0100
Subject: [PATCH 47/52] chore: remove comment

---
 packages/nuxt/src/pages/module.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 66be372a485b..161d928c7f60 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -291,8 +291,6 @@ export default defineNuxtModule({
     nuxt.options.vite.resolve.dedupe = nuxt.options.vite.resolve.dedupe || []
     nuxt.options.vite.resolve.dedupe.push('vue-router')
 
-    // TODO: Do we need to provide a fallback for this? Or can we just expose
-    // `router.options` from the router instance itself
     // Add router options template
     addTemplate({
       filename: 'router.options.mjs',

From ed4e2a6dd40e026d035f9f7f64ebf6c96f2d4b99 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 21:27:30 +0100
Subject: [PATCH 48/52] fix(nuxt): remove unplugin and handle hmr in nuxt

---
 packages/nuxt/src/pages/module.ts | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 161d928c7f60..29ee34404031 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -6,8 +6,6 @@ import { genImport, genObjectFromRawEntries, genString } from 'knitwork'
 import escapeRE from 'escape-string-regexp'
 import { joinURL } from 'ufo'
 import type { NuxtApp, NuxtPage } from 'nuxt/schema'
-import VueRouterVite from 'unplugin-vue-router/vite'
-import VueRouterWebpack from 'unplugin-vue-router/webpack'
 import { createRoutesContext } from 'unplugin-vue-router'
 import { resolveOptions } from 'unplugin-vue-router/options'
 import type { EditableTreeNode, Options as TypedRouterOptions } from 'unplugin-vue-router'
@@ -77,11 +75,13 @@ export default defineNuxtModule({
 
     if (useExperimentalTypedPages) {
       const declarationFile = './types/typed-router.d.ts'
+
       const options: TypedRouterOptions = {
         routesFolder: [],
         dts: resolve(nuxt.options.buildDir, declarationFile),
         logs: true,
         async beforeWriteFiles (rootPage) {
+          rootPage.children.forEach(child => child.delete())
           const pages = await resolvePagesRoutes()
           await nuxt.callHook('pages:extend', pages)
           function addPage (parent: EditableTreeNode, page: NuxtPage) {
@@ -115,11 +115,12 @@ export default defineNuxtModule({
         references.push({ path: declarationFile })
       })
 
+      const context = createRoutesContext(resolveOptions(options))
+      const dtsFile = resolve(nuxt.options.buildDir, declarationFile)
+      await mkdir(dirname(dtsFile), { recursive: true })
+      await context.scanPages(false)
+
       if (nuxt.options._prepare) {
-        const context = createRoutesContext(resolveOptions(options))
-        const dtsFile = resolve(nuxt.options.buildDir, declarationFile)
-        await mkdir(dirname(dtsFile), { recursive: true })
-        await context.scanPages()
         // TODO: could we generate this from context instead?
         const dts = await readFile(dtsFile, 'utf-8')
         addTemplate({
@@ -128,8 +129,12 @@ export default defineNuxtModule({
         })
       }
 
-      addVitePlugin(VueRouterVite(options), { prepend: true })
-      addWebpackPlugin(VueRouterWebpack(options), { prepend: true })
+      // Regenerate types/typed-router.d.ts when adding or removing pages
+      nuxt.hook('builder:generateApp', async (options) => {
+        if (!options?.filter || options.filter({ filename: 'routes.mjs' } as any)) {
+          await context.scanPages()
+        }
+      })
     }
 
     const runtimeDir = resolve(distDir, 'pages/runtime')

From 6e79f81637ef09c83493d5d965d576b15cc09772 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 2 May 2023 21:28:00 +0100
Subject: [PATCH 49/52] fix: disable logs by default

---
 packages/nuxt/src/pages/module.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 29ee34404031..72a5020759a4 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -79,7 +79,7 @@ export default defineNuxtModule({
       const options: TypedRouterOptions = {
         routesFolder: [],
         dts: resolve(nuxt.options.buildDir, declarationFile),
-        logs: true,
+        logs: nuxt.options.debug,
         async beforeWriteFiles (rootPage) {
           rootPage.children.forEach(child => child.delete())
           const pages = await resolvePagesRoutes()

From f2689b94613cda1ef43afbca705beba563756a5f Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Fri, 5 May 2023 15:49:11 +0100
Subject: [PATCH 50/52] test: update test import

---
 test/fixtures/basic/types.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/fixtures/basic/types.ts b/test/fixtures/basic/types.ts
index f615133a4ca6..4caf8a256f5b 100644
--- a/test/fixtures/basic/types.ts
+++ b/test/fixtures/basic/types.ts
@@ -1,7 +1,7 @@
 import { describe, expectTypeOf, it } from 'vitest'
 import type { Ref } from 'vue'
 import type { FetchError } from 'ofetch'
-import type { NavigationFailure, RouteLocationNormalizedLoaded, RouteLocationRaw, Router, useRouter as vueUseRouter } from 'vue-router/auto'
+import type { NavigationFailure, RouteLocationNormalizedLoaded, RouteLocationRaw, Router, useRouter as vueUseRouter } from '#vue-router'
 
 import type { AppConfig, RuntimeValue } from 'nuxt/schema'
 import { defineNuxtConfig } from 'nuxt/config'

From dd13ca41ba47ca771660484105aafa93e266f136 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 9 May 2023 11:51:40 +0100
Subject: [PATCH 51/52] fix: update reference

---
 packages/nuxt/src/pages/module.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index 1d6d4b05b5c3..bfd569ce3e51 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -141,7 +141,7 @@ export default defineNuxtModule({
 
     // Add $router types
     nuxt.hook('prepare:types', ({ references }) => {
-      references.push({ types: 'vue-router' })
+      references.push({ types: useExperimentalTypedPages ? 'vue-router/auto' : 'vue-router' })
     })
 
     // Add vue-router route guard imports

From 9976c62036e1313e603cf30d5d363ae37ffa3d15 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 9 May 2023 16:34:37 +0100
Subject: [PATCH 52/52] chore: update version

---
 packages/nuxt/package.json |   2 +-
 pnpm-lock.yaml             | 146 +++++++++++++++++++++----------------
 2 files changed, 84 insertions(+), 64 deletions(-)

diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json
index aad6e865f183..81dbca5995ee 100644
--- a/packages/nuxt/package.json
+++ b/packages/nuxt/package.json
@@ -94,7 +94,7 @@
     "unenv": "^1.4.1",
     "unimport": "^3.0.6",
     "unplugin": "^1.3.1",
-    "unplugin-vue-router": "~0.6.3",
+    "unplugin-vue-router": "^0.6.4",
     "untyped": "^1.3.2",
     "vue": "^3.2.47",
     "vue-bundle-renderer": "^1.0.3",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 86aad7597633..e483d0797128 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -448,8 +448,8 @@ importers:
         specifier: ^1.3.1
         version: 1.3.1
       unplugin-vue-router:
-        specifier: ~0.6.3
-        version: 0.6.3(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47)
+        specifier: ^0.6.4
+        version: 0.6.4(rollup@3.21.5)(vue-router@4.1.6)(vue@3.2.47)
       untyped:
         specifier: ^1.3.2
         version: 1.3.2
@@ -1071,6 +1071,11 @@ packages:
     resolution: {integrity: sha512-nHtDoQcuqFmwYNYPz3Rah5ph2p8PFeFCsZk9A/48dPc/rGocJ5J3hAAZ7pb76VWX3fZKu+uEr/FhH5jLx7umrw==}
     engines: {node: '>=6.9.0'}
 
+  /@babel/helper-string-parser@7.21.5:
+    resolution: {integrity: sha512-5pTUx3hAJaZIdW99sJ6ZUUgWq/Y+Hja7TowEnLNMm1VivRgZQL3vpBY3qUACVsvw+yQU6+YgfBVmcbLaZtrA1w==}
+    engines: {node: '>=6.9.0'}
+    dev: false
+
   /@babel/helper-validator-identifier@7.19.1:
     resolution: {integrity: sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==}
     engines: {node: '>=6.9.0'}
@@ -1281,6 +1286,15 @@ packages:
       '@babel/helper-validator-identifier': 7.19.1
       to-fast-properties: 2.0.0
 
+  /@babel/types@7.21.5:
+    resolution: {integrity: sha512-m4AfNvVF2mVC/F7fDEdH2El3HzUg9It/XsCxZiOTTA3m3qYfcSVSbTfM6Q9xG+hYDniZssYhlXKKUMD5m8tF4Q==}
+    engines: {node: '>=6.9.0'}
+    dependencies:
+      '@babel/helper-string-parser': 7.21.5
+      '@babel/helper-validator-identifier': 7.19.1
+      to-fast-properties: 2.0.0
+    dev: false
+
   /@cloudflare/kv-asset-handler@0.3.0:
     resolution: {integrity: sha512-9CB/MKf/wdvbfkUdfrj+OkEwZ5b7rws0eogJ4293h+7b6KX5toPwym+VQKmILafNB9YiehqY0DlNrDcDhdWHSQ==}
     dependencies:
@@ -2508,8 +2522,8 @@ packages:
       '@volar/vue-language-core': 1.6.4
       typescript: 5.0.4
 
-  /@vue-macros/common@1.2.0(rollup@3.21.0)(vue@3.2.47):
-    resolution: {integrity: sha512-lQglnRn+8wkdAhmGQbrI0mo4SzRuY5KBjst0qi8LBDYllFKtI2brapbewUME1AXnXbVett0SRDnB2EdZXyzCmw==}
+  /@vue-macros/common@1.3.1(rollup@3.21.5)(vue@3.2.47):
+    resolution: {integrity: sha512-Lc5aP/8HNJD1XrnvpeNuWcCf82bZdR3auN/chA1b/1rKZgSnmQkH9f33tKO9qLwXSy+u4hpCi8Rw+oUuF1KCeg==}
     engines: {node: '>=14.19.0'}
     peerDependencies:
       vue: ^2.7.0 || ^3.2.25
@@ -2517,9 +2531,9 @@ packages:
       vue:
         optional: true
     dependencies:
-      '@babel/types': 7.21.4
-      '@rollup/pluginutils': 5.0.2(rollup@3.21.0)
-      '@vue/compiler-sfc': 3.3.0-beta.2
+      '@babel/types': 7.21.5
+      '@rollup/pluginutils': 5.0.2(rollup@3.21.5)
+      '@vue/compiler-sfc': 3.3.0-beta.5
       local-pkg: 0.4.3
       magic-string-ast: 0.1.2
       vue: 3.2.47
@@ -2554,22 +2568,22 @@ packages:
       estree-walker: 2.0.2
       source-map: 0.6.1
 
-  /@vue/compiler-core@3.3.0-beta.2:
-    resolution: {integrity: sha512-Z2VZCL9Rr1gVgyALHIRP+lNFjgfs/K4aTxvJYQ2vhgEAaI0/L6wtG5sr/gOP+MgxwGQV0PvA+iDG3Y3PC7rTEg==}
+  /@vue/compiler-core@3.3.0-beta.3:
+    resolution: {integrity: sha512-mv2rPo4JHou6ebm7+U/wO1HpA6W1zDfTqbt4fqjoXrMwU4DWNgRcLKTXG6G3cXV4mOe+2YgWspfxEzo7fPTMKg==}
     dependencies:
       '@babel/parser': 7.21.4
-      '@vue/shared': 3.3.0-beta.2
+      '@vue/shared': 3.3.0-beta.3
       estree-walker: 2.0.2
       source-map-js: 1.0.2
-    dev: false
 
-  /@vue/compiler-core@3.3.0-beta.3:
-    resolution: {integrity: sha512-mv2rPo4JHou6ebm7+U/wO1HpA6W1zDfTqbt4fqjoXrMwU4DWNgRcLKTXG6G3cXV4mOe+2YgWspfxEzo7fPTMKg==}
+  /@vue/compiler-core@3.3.0-beta.5:
+    resolution: {integrity: sha512-rwKXIMPDKBzKypcZ7Zc+i4e7ItnhlMEu9QZveek2yLxzMG0QimvZnVKB7eD21cQ9MCwEYW4bb8zjisPMJNNaqQ==}
     dependencies:
       '@babel/parser': 7.21.4
-      '@vue/shared': 3.3.0-beta.3
+      '@vue/shared': 3.3.0-beta.5
       estree-walker: 2.0.2
       source-map-js: 1.0.2
+    dev: false
 
   /@vue/compiler-dom@3.2.47:
     resolution: {integrity: sha512-dBBnEHEPoftUiS03a4ggEig74J2YBZ2UIeyfpcRM2tavgMWo4bsEfgCGsu+uJIL/vax9S+JztH8NmQerUo7shQ==}
@@ -2577,19 +2591,19 @@ packages:
       '@vue/compiler-core': 3.2.47
       '@vue/shared': 3.2.47
 
-  /@vue/compiler-dom@3.3.0-beta.2:
-    resolution: {integrity: sha512-9LPRdCj66OwmUiPa9nuKiaoyKxlFT56j+io8nK/aW5OLl1UkY//Lj661fmDkTY20oLmArt73fAuHD913w4hRqA==}
-    dependencies:
-      '@vue/compiler-core': 3.3.0-beta.2
-      '@vue/shared': 3.3.0-beta.2
-    dev: false
-
   /@vue/compiler-dom@3.3.0-beta.3:
     resolution: {integrity: sha512-e7VpjN9wYiuJdJos6Uoe501CzdMkfaEr/27Ks4Ss7Irtcj5YA/S1OROZ35Xl2Pc3ctx6beq5RpcOvnMqh0hcaA==}
     dependencies:
       '@vue/compiler-core': 3.3.0-beta.3
       '@vue/shared': 3.3.0-beta.3
 
+  /@vue/compiler-dom@3.3.0-beta.5:
+    resolution: {integrity: sha512-OsYuAzl8zHRym5TfDhCLrcTSBt71BFJXnTC9uWO+SfgqadadWZxv1piPebjtwJcODkks5OAGfdhxzKdNzzddXw==}
+    dependencies:
+      '@vue/compiler-core': 3.3.0-beta.5
+      '@vue/shared': 3.3.0-beta.5
+    dev: false
+
   /@vue/compiler-sfc@3.2.47:
     resolution: {integrity: sha512-rog05W+2IFfxjMcFw10tM9+f7i/+FFpZJJ5XHX72NP9eC2uRD+42M3pYcQqDXVYoj74kHMSEdQ/WmCjt8JFksQ==}
     dependencies:
@@ -2604,21 +2618,6 @@ packages:
       postcss: 8.4.23
       source-map: 0.6.1
 
-  /@vue/compiler-sfc@3.3.0-beta.2:
-    resolution: {integrity: sha512-5FmcQ5LIpM/Y22dTxnxWPD04jC2gr6XSVVqQNY0y776F1P9x4f06fIpMibL58aKU07Th2z4Ab3oPg/Cg1QNVmA==}
-    dependencies:
-      '@babel/parser': 7.21.4
-      '@vue/compiler-core': 3.3.0-beta.2
-      '@vue/compiler-dom': 3.3.0-beta.2
-      '@vue/compiler-ssr': 3.3.0-beta.2
-      '@vue/reactivity-transform': 3.3.0-beta.2
-      '@vue/shared': 3.3.0-beta.2
-      estree-walker: 2.0.2
-      magic-string: 0.30.0
-      postcss: 8.4.23
-      source-map-js: 1.0.2
-    dev: false
-
   /@vue/compiler-sfc@3.3.0-beta.3:
     resolution: {integrity: sha512-6shZNooetShjSMHJvgVoE0EM8pOMV5vnrzsHoCU06stzV+kqRJQpbN7xf2s9wK2fgHMIBSMINrM9AuZiQnNCJg==}
     dependencies:
@@ -2633,25 +2632,40 @@ packages:
       postcss: 8.4.23
       source-map-js: 1.0.2
 
+  /@vue/compiler-sfc@3.3.0-beta.5:
+    resolution: {integrity: sha512-CbiY2dkzU5IG652ygLUSufLGvXPKI12TQp1PeHs9acjgFjhvSJCSKmAOaCWnXgFsAgpbipPHgAMfWJ8B0h6Sjw==}
+    dependencies:
+      '@babel/parser': 7.21.4
+      '@vue/compiler-core': 3.3.0-beta.5
+      '@vue/compiler-dom': 3.3.0-beta.5
+      '@vue/compiler-ssr': 3.3.0-beta.5
+      '@vue/reactivity-transform': 3.3.0-beta.5
+      '@vue/shared': 3.3.0-beta.5
+      estree-walker: 2.0.2
+      magic-string: 0.30.0
+      postcss: 8.4.23
+      source-map-js: 1.0.2
+    dev: false
+
   /@vue/compiler-ssr@3.2.47:
     resolution: {integrity: sha512-wVXC+gszhulcMD8wpxMsqSOpvDZ6xKXSVWkf50Guf/S+28hTAXPDYRTbLQ3EDkOP5Xz/+SY37YiwDquKbJOgZw==}
     dependencies:
       '@vue/compiler-dom': 3.2.47
       '@vue/shared': 3.2.47
 
-  /@vue/compiler-ssr@3.3.0-beta.2:
-    resolution: {integrity: sha512-Xg9od6GvHwfEpnTxMQR+KlKG1nbOHWRLHCiSA0FENiSDTjCDHh0ClzZLhIZUZJD75miyE9ia5ZQF6vpw680rCw==}
-    dependencies:
-      '@vue/compiler-dom': 3.3.0-beta.2
-      '@vue/shared': 3.3.0-beta.2
-    dev: false
-
   /@vue/compiler-ssr@3.3.0-beta.3:
     resolution: {integrity: sha512-egJ0lEVAod3Hpnw96cJ/0a9qv5f5h5/VCBpKYT8scqkzoMsikh8AJant2omokBCL/Ut5UAMLVQlA5b66+2Ys/g==}
     dependencies:
       '@vue/compiler-dom': 3.3.0-beta.3
       '@vue/shared': 3.3.0-beta.3
 
+  /@vue/compiler-ssr@3.3.0-beta.5:
+    resolution: {integrity: sha512-16njciFrQ8ejVdH5tsaPbJwpkpBB2z2VWCxfC69UOylCgPxiW01syE9S/mozRvv5Ken9Sr9bd2MjebG/SEpPNg==}
+    dependencies:
+      '@vue/compiler-dom': 3.3.0-beta.5
+      '@vue/shared': 3.3.0-beta.5
+    dev: false
+
   /@vue/devtools-api@6.5.0:
     resolution: {integrity: sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q==}
 
@@ -2664,24 +2678,24 @@ packages:
       estree-walker: 2.0.2
       magic-string: 0.30.0
 
-  /@vue/reactivity-transform@3.3.0-beta.2:
-    resolution: {integrity: sha512-EUL53/rsd+hrqhCa/SrhXQ6PzMZJfLQt39xQlzr0Sxsdv/bg5lqbcK9YtGkjYohRuSp1QneFU78LEsQ9j4B2Dw==}
+  /@vue/reactivity-transform@3.3.0-beta.3:
+    resolution: {integrity: sha512-aM3TgBca9QMMu/9B9ASRVvckeZpAdJO9nmQh5UCznhoDYjVxQPS+sCQvH6TLOjPB1MDQMVQYg4ZiPqfVVo7NbA==}
     dependencies:
       '@babel/parser': 7.21.4
-      '@vue/compiler-core': 3.3.0-beta.2
-      '@vue/shared': 3.3.0-beta.2
+      '@vue/compiler-core': 3.3.0-beta.3
+      '@vue/shared': 3.3.0-beta.3
       estree-walker: 2.0.2
       magic-string: 0.30.0
-    dev: false
 
-  /@vue/reactivity-transform@3.3.0-beta.3:
-    resolution: {integrity: sha512-aM3TgBca9QMMu/9B9ASRVvckeZpAdJO9nmQh5UCznhoDYjVxQPS+sCQvH6TLOjPB1MDQMVQYg4ZiPqfVVo7NbA==}
+  /@vue/reactivity-transform@3.3.0-beta.5:
+    resolution: {integrity: sha512-v/PCri6+vL8WwwgowHlIopwiqonCj9wV60ZYDdX8AMDxk9Q01h2cWh61JF4XOX7qDs7NdJ7zSVyKSz4B98OXBw==}
     dependencies:
       '@babel/parser': 7.21.4
-      '@vue/compiler-core': 3.3.0-beta.3
-      '@vue/shared': 3.3.0-beta.3
+      '@vue/compiler-core': 3.3.0-beta.5
+      '@vue/shared': 3.3.0-beta.5
       estree-walker: 2.0.2
       magic-string: 0.30.0
+    dev: false
 
   /@vue/reactivity@3.2.47:
     resolution: {integrity: sha512-7khqQ/75oyyg+N/e+iwV6lpy1f5wq759NdlS1fpAhFXa8VeAIKGgk2E/C4VF59lx5b+Ezs5fpp/5WsRYXQiKxQ==}
@@ -2718,13 +2732,13 @@ packages:
   /@vue/shared@3.2.47:
     resolution: {integrity: sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ==}
 
-  /@vue/shared@3.3.0-beta.2:
-    resolution: {integrity: sha512-AsHYKYiYUnL/LHog6iV/G9tctFZYOsaxHDbSnfeyip94rjndO46XSDbHek7wDlcj3NHGaf8jAQQKfva/7mypjA==}
-    dev: false
-
   /@vue/shared@3.3.0-beta.3:
     resolution: {integrity: sha512-st1SnB/Bkbb9TsieeI4TRX9TqHYIR5wvIma3ZtEben55EYSWa1q5u2BhTNgABSdH+rv3Xwfrvpwh5PmCw6Y53g==}
 
+  /@vue/shared@3.3.0-beta.5:
+    resolution: {integrity: sha512-ImwhHfOzuQrfA05Kx4s7J9g7QJt0sZqSlPvPdd6xj5tTEnPNNJYZOHaIP973mtuEuv4Zfh9v+CLiER6E6gtSqg==}
+    dev: false
+
   /@webassemblyjs/ast@1.11.5:
     resolution: {integrity: sha512-LHY/GSAZZRpsNQH+/oHqhRQ5FT7eoULcBqgfyTB5nQHogFnK3/7QoN7dLnwSE/JkUAF0SrRuclT7ODqMFtWxxQ==}
     dependencies:
@@ -3076,7 +3090,7 @@ packages:
     engines: {node: '>=14.19.0'}
     dependencies:
       '@babel/parser': 7.21.4
-      '@babel/types': 7.21.4
+      '@babel/types': 7.21.5
     dev: false
 
   /async-sema@3.1.1:
@@ -8441,17 +8455,17 @@ packages:
     resolution: {integrity: sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==}
     engines: {node: '>= 10.0.0'}
 
-  /unplugin-vue-router@0.6.3(rollup@3.21.0)(vue-router@4.1.6)(vue@3.2.47):
-    resolution: {integrity: sha512-Gljn3TGRdBcfQpJPnUEaFltHkZDRKp/4uE2lGMlsbBpCK8wFdHzIP3iRj5RL1ISYtK9FHGv+kEwFhLNe0/ab8w==}
+  /unplugin-vue-router@0.6.4(rollup@3.21.5)(vue-router@4.1.6)(vue@3.2.47):
+    resolution: {integrity: sha512-9THVhhtbVFxbsIibjK59oPwMI1UCxRWRPX7azSkTUABsxovlOXJys5SJx0kd/0oKIqNJuYgkRfAgPuO77SqCOg==}
     peerDependencies:
       vue-router: ^4.1.0
     peerDependenciesMeta:
       vue-router:
         optional: true
     dependencies:
-      '@babel/types': 7.21.4
-      '@rollup/pluginutils': 5.0.2(rollup@3.21.0)
-      '@vue-macros/common': 1.2.0(rollup@3.21.0)(vue@3.2.47)
+      '@babel/types': 7.21.5
+      '@rollup/pluginutils': 5.0.2(rollup@3.21.5)
+      '@vue-macros/common': 1.3.1(rollup@3.21.5)(vue@3.2.47)
       ast-walker-scope: 0.4.1
       chokidar: 3.5.3
       fast-glob: 3.2.12
@@ -8462,7 +8476,7 @@ packages:
       scule: 1.0.0
       unplugin: 1.3.1
       vue-router: 4.1.6(vue@3.2.47)
-      yaml: 2.2.1
+      yaml: 2.2.2
     transitivePeerDependencies:
       - rollup
       - vue
@@ -9158,6 +9172,12 @@ packages:
   /yaml@2.2.1:
     resolution: {integrity: sha512-e0WHiYql7+9wr4cWMx3TVQrNwejKaEe7/rHNmQmqRjazfOP5W8PB6Jpebb5o6fIapbz9o9+2ipcaTM2ZwDI6lw==}
     engines: {node: '>= 14'}
+    dev: true
+
+  /yaml@2.2.2:
+    resolution: {integrity: sha512-CBKFWExMn46Foo4cldiChEzn7S7SRV+wqiluAb6xmueD/fGyRHIhX8m14vVGgeFWjN540nKCNVj6P21eQjgTuA==}
+    engines: {node: '>= 14'}
+    dev: false
 
   /yargs-parser@21.1.1:
     resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==}