fix(nuxt3): define route in plugin rather than composable (#2443)

packages/nuxt3/src/pages/runtime/composables.ts

@@ -1,4 +1,3 @@
-import { computed, reactive } from 'vue'
 import type { Router, RouteLocationNormalizedLoaded } from 'vue-router'
 import { useNuxtApp } from '#app'
 
@@ -6,18 +5,6 @@ export const useRouter = () => {
   return useNuxtApp().$router as Router
 }
 
-export const useRoute = (): RouteLocationNormalizedLoaded => {
+export const useRoute = () => {
-  const nuxtApp = useNuxtApp()
+  return useNuxtApp()._route as RouteLocationNormalizedLoaded
-  if (nuxtApp._route) {
-    return nuxtApp._route
-  }
-
-  const currentRoute = (nuxtApp.$router as Router).currentRoute
-
-  // https://github.com/vuejs/vue-router-next/blob/master/src/router.ts#L1192-L1200
-  nuxtApp._route = reactive(Object.fromEntries(
-    Object.keys(currentRoute.value).map(key => [key, computed(() => currentRoute.value[key])])
-  ) as any)
-
-  return nuxtApp._route
 }

packages/nuxt3/src/pages/runtime/router.ts

@@ -1,4 +1,4 @@
-import { shallowRef } from 'vue'
+import { computed, reactive, shallowRef } from 'vue'
 import {
   createRouter,
   createWebHistory,
@@ -46,6 +46,14 @@ export default defineNuxtPlugin((nuxtApp) => {
     get: () => previousRoute.value
   })
 
+  // https://github.com/vuejs/vue-router-next/blob/master/src/router.ts#L1192-L1200
+  const route = {}
+  for (const key in router.currentRoute.value) {
+    route[key] = computed(() => router.currentRoute.value[key])
+  }
+
+  nuxtApp._route = reactive(route)
+
   nuxtApp.hook('app:created', async () => {
     if (process.server) {
       router.push(nuxtApp.ssrContext.url)