chore: migrate vue-router

Author: mubaidr

.eslintcache

@@ -37,13 +37,12 @@
     "typescript-eslint": "^8.55.0",
     "unplugin-imagemin": "^0.7.0",
     "unplugin-turbo-console": "^2.3.0",
-    "unplugin-vue-router": "^0.19.2",
     "vite": "^7.3.1",
     "vite-plugin-vue-devtools": "^8.0.6",
     "vite-plugin-zip-pack": "^1.2.4",
     "vue": "^3.5.28",
     "vue-i18n": "^11.2.8",
-    "vue-router": "^4.6.0",
+    "vue-router": "^5.0.0",
     "vue-tsc": "^3.2.4",
     "web-ext": "^9.3.0",
     "webext-bridge": "^6.0.1",

package-lock.json

@@ -10,8 +10,6 @@
 </template>
 
 <script setup lang="ts">
-import { defineProps } from "vue"
-
 defineProps<{
   error: string
 }>()

package.json

@@ -1,26 +1,29 @@
 /* eslint-disable */
 /* prettier-ignore */
+// oxfmt-ignore
 // @ts-nocheck
 // noinspection ES6UnusedImports
-// Generated by unplugin-vue-router. !! DO NOT MODIFY THIS FILE !!
+// Generated by vue-router. !! DO NOT MODIFY THIS FILE !!
 // It's recommended to commit this file.
 // Make sure to add this file to your tsconfig.json file as an "includes" or "files" entry.
 
-declare module 'vue-router/auto-resolver' {
-  export type ParamParserCustom = never
+import type {
+  RouteRecordInfo,
+  ParamValue,
+  ParamValueOneOrMore,
+  ParamValueZeroOrMore,
+  ParamValueZeroOrOne,
+} from 'vue-router'
+
+declare module 'vue-router' {
+  interface TypesConfig {
+    ParamParsers: never
+  }
 }
 
 declare module 'vue-router/auto-routes' {
-  import type {
-    RouteRecordInfo,
-    ParamValue,
-    ParamValueOneOrMore,
-    ParamValueZeroOrMore,
-    ParamValueZeroOrOne,
-  } from 'vue-router'
-
   /**
-   * Route name map generated by unplugin-vue-router
+   * Route name map generated by vue-router
    */
   export interface RouteNamedMap {
     '/action-popup/': RouteRecordInfo<
@@ -131,7 +134,7 @@ declare module 'vue-router/auto-routes' {
   }
 
   /**
-   * Route file to route info map by unplugin-vue-router.
+   * Route file to route info map by vue-router.
    * Used by the \`sfc-typed-router\` Volar plugin to automatically type \`useRoute()\`.
    *
    * Each key is a file path relative to the project root with 2 properties:
@@ -244,3 +247,5 @@ declare module 'vue-router/auto-routes' {
       ? Info['routes']
       : keyof RouteNamedMap
 }
+
+export {}

src/components/state/DisplayError.vue

@@ -1,5 +1,4 @@
 /// <reference types="vite/client" />
-/// <reference types="unplugin-vue-router/client" />
 
 // Put your variables here:
 

src/types/typed-router.d.ts

@@ -1,14 +1,17 @@
-import { createRouter, createWebHistory } from "vue-router"
+import { createRouter, createWebHashHistory } from "vue-router"
 import { handleHotUpdate, routes } from "vue-router/auto-routes"
 
-routes.push({
-  path: "/:catchAll(.*)*",
-  redirect: "/",
-})
+const finalRoutes = [
+  ...routes,
+  {
+    path: "/:catchAll(.*)*",
+    redirect: "/",
+  },
+]
 
 export const appRouter = createRouter({
-  history: createWebHistory(import.meta.env.BASE_URL),
-  routes,
+  history: createWebHashHistory(),
+  routes: finalRoutes,
 })
 
 if (import.meta.hot) {

src/types/vite-env.d.ts

@@ -3,7 +3,7 @@ import { fileURLToPath } from "node:url"
 import { defineConfig } from "vite"
 import vue from "@vitejs/plugin-vue"
 import vueDevTools from "vite-plugin-vue-devtools"
-import VueRouter from "unplugin-vue-router/vite"
+import VueRouter from "vue-router/vite"
 import TurboConsole from "unplugin-turbo-console/vite"
 import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite"
 import ui from "@nuxt/ui/vite"