fix: suppress warning on 'prefix' strategy (#23)

* fix: suppress warning on 'prefix' strategy

* revert vitest version

* fix

package.json

@@ -10,32 +10,32 @@
     "url": "https://github.com/inlitify/routing/issues"
   },
   "devDependencies": {
-    "@intlify/eslint-plugin-vue-i18n": "^1.3.0",
+    "@intlify/eslint-plugin-vue-i18n": "^1.4.1",
     "@nexhome/yorkie": "^2.0.8",
     "@types/js-yaml": "^4.0.5",
-    "@types/node": "^18.7.18",
-    "@typescript-eslint/eslint-plugin": "^5.36.1",
-    "@typescript-eslint/parser": "^5.36.1",
+    "@types/node": "^18.11.9",
+    "@typescript-eslint/eslint-plugin": "^5.42.0",
+    "@typescript-eslint/parser": "^5.42.0",
     "bumpp": "^8.2.1",
     "cross-env": "^7.0.3",
-    "eslint": "^8.23.0",
+    "eslint": "^8.26.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-import-resolver-alias": "^1.1.2",
-    "eslint-import-resolver-typescript": "^3.5.1",
+    "eslint-import-resolver-typescript": "^3.5.2",
     "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-vue": "^9.5.1",
-    "globby": "^12.0.2",
+    "eslint-plugin-vue": "^9.7.0",
+    "globby": "^12.2.0",
     "happy-dom": "^6.0.4",
-    "jiti": "^1.15.0",
+    "jiti": "^1.16.0",
     "js-yaml": "^4.1.0",
-    "lint-staged": "^12.1.2",
+    "lint-staged": "^12.5.0",
     "npm-run-all": "^4.1.5",
-    "pathe": "^0.3.7",
-    "pkg-types": "^0.3.5",
+    "pathe": "^0.3.9",
+    "pkg-types": "^0.3.6",
     "prettier": "^2.7.1",
     "rimraf": "^3.0.2",
-    "typescript": "^4.8.3",
+    "typescript": "^4.8.4",
     "vue-eslint-parser": "^9.1.0"
   },
   "engines": {

packages/vue-i18n-routing/package.json

@@ -17,16 +17,16 @@
     "@intlify/shared": "next",
     "@intlify/vue-i18n-bridge": "^0.7.0",
     "@intlify/vue-router-bridge": "^0.7.0",
-    "ufo": "^0.8.5",
-    "vue-demi": "^0.13.5"
+    "ufo": "^0.8.6",
+    "vue-demi": "^0.13.11"
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.31.1",
     "api-docs-gen": "^0.4.0",
-    "typescript": "^4.8.3",
-    "vite": "^3.1.2",
+    "typescript": "^4.8.4",
+    "vite": "^3.2.2",
     "vite-plugin-dts": "^0.9.6",
-    "vitest": "^0.23.4",
+    "vitest": "^0.24.5",
     "vue": "^3.2.27",
     "vue-i18n": "npm:vue-i18n@next",
     "vue-i18n-bridge": "next",

packages/vue-i18n-routing/src/__test__/compatibles.test.ts

@@ -86,7 +86,6 @@ describe('localePath', () => {
           // path
           assert.equal(vm.localePath('/'), '/en')
           assert.equal(vm.localePath('/about', 'ja'), '/ja/about')
-          assert.equal(vm.localePath('/:pathMatch(.*)*', 'ja'), '/ja/:pathMatch(.*)*')
           // name
           assert.equal(vm.localePath('index', 'ja'), '/ja')
           assert.equal(vm.localePath('about'), '/en/about')
@@ -132,7 +131,6 @@ describe('localePath', () => {
         // path
         assert.equal(vm.localePath('/'), '/')
         assert.equal(vm.localePath('/about', 'ja'), '/about')
-        assert.equal(vm.localePath('/:pathMatch(.*)*', 'ja'), '/:pathMatch(.*)*')
         // name
         assert.equal(vm.localePath('index', 'ja'), '/')
         assert.equal(vm.localePath('about'), '/about')

packages/vue-i18n-routing/src/compatibles/routing.ts

@@ -5,7 +5,7 @@ import { isVue3, isRef, unref, isVue2 } from 'vue-demi'
 import { DEFAULT_DYNAMIC_PARAMS_KEY } from '../constants'
 import { getLocale, getLocaleRouteName, getRouteName } from '../utils'
 
-import { getI18nRoutingOptions } from './utils'
+import { getI18nRoutingOptions, resolve } from './utils'
 
 import type { Strategies, I18nRoutingOptions } from '../types'
 import type { RoutingProxy, PrefixableOptions, SwitchLocalePathIntercepter } from './types'
@@ -122,7 +122,7 @@ export function resolveRoute(this: RoutingProxy, route: any, locale?: Locale): a
   if (localizedRoute.path && !localizedRoute.name) {
     let _resolvedRoute = null
     try {
-      _resolvedRoute = router.resolve(localizedRoute) as any
+      _resolvedRoute = resolve(router, localizedRoute, strategy, _locale)
     } catch {}
     // prettier-ignore
     const resolvedRoute = isVue3

packages/vue-i18n-routing/src/compatibles/utils.ts

@@ -1,3 +1,6 @@
+import { assign, isArray } from '@intlify/shared'
+import { isVue3 } from 'vue-demi'
+
 import {
   DEFAULT_ROUTES_NAME_SEPARATOR,
   DEFAULT_LOCALE_ROUTE_NAME_SUFFIX,
@@ -12,7 +15,9 @@ import { getGlobalOptions } from '../extends/router'
 import { DefaultPrefixable, DefaultSwitchLocalePathIntercepter } from './routing'
 
 import type { I18nRoutingGlobalOptions } from '../extends/router'
+import type { Strategies } from '../types'
 import type { RoutingProxy } from './types'
+import type { Locale } from '@intlify/vue-i18n-bridge'
 import type { VueRouter, Router } from '@intlify/vue-router-bridge'
 
 export function getI18nRoutingOptions(
@@ -47,3 +52,38 @@ export function getI18nRoutingOptions(
     dynamicRouteParamsKey: proxy.dynamicRouteParamsKey || options.dynamicRouteParamsKey || dynamicRouteParamsKey
   }
 }
+
+function split(str: string, index: number) {
+  const result = [str.slice(0, index), str.slice(index)]
+  return result
+}
+
+/**
+ * NOTE:
+ * vue-router v4.x `router.resolve` for a non exists path will output a warning.
+ * `router.hasRoute`, which checks for the route can only be a named route.
+ * When using the `prefix` strategy, the path specified by `localePath` is specified as a path not prefixed with a locale.
+ * This will cause vue-router to issue a warning, so we can work-around by using `router.options.routes`.
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function resolve(router: Router | VueRouter, route: any, strategy: Strategies, locale: Locale): any {
+  if (isVue3 && strategy === 'prefix') {
+    if (isArray(route.matched) && route.matched.length > 0) {
+      return route.matched[0]
+    }
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const [rootSlash, restPath] = split(route.path, 1)
+    const targetPath = `${rootSlash}${locale}${restPath === '' ? restPath : `/${restPath}`}`
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const _route = (router as any).options.routes.find((r: any) => r.path === targetPath)
+    if (_route == null) {
+      return route
+    } else {
+      const _resolevableRoute = assign({}, _route)
+      _resolevableRoute.path = targetPath
+      return router.resolve(_resolevableRoute)
+    }
+  } else {
+    return router.resolve(route)
+  }
+}

packages/vue-i18n-routing/src/composables/__test__/routing.test.ts

@@ -112,7 +112,6 @@ describe('useLocalePath', () => {
           // path
           assert.equal(localePath('/'), '/en')
           assert.equal(localePath('/about', 'ja'), '/ja/about')
-          assert.equal(localePath('/:pathMatch(.*)*', 'ja'), '/ja/:pathMatch(.*)*')
           // name
           assert.equal(localePath('index', 'ja'), '/ja')
           assert.equal(localePath('about'), '/en/about')
@@ -146,7 +145,6 @@ describe('useLocalePath', () => {
         // path
         assert.equal(localePath('/'), '/')
         assert.equal(localePath('/about', 'ja'), '/about')
-        assert.equal(localePath('/:pathMatch(.*)*', 'ja'), '/:pathMatch(.*)*')
         // name
         assert.equal(localePath('index', 'ja'), '/')
         assert.equal(localePath('about'), '/about')

playground/vue2-options/package.json

@@ -15,7 +15,7 @@
     "vue-router": "3.5.3",
     "vue-i18n": "^8",
     "vue-i18n-bridge": "^9.3.0-beta.6",
-    "vue-i18n-routing": "0.2.1"
+    "vue-i18n-routing": "0.8.0"
   },
   "devDependencies": {
     "@types/node": "^18.0.4",
@@ -26,7 +26,7 @@
     "vite": "2.9.12",
     "playwright": "1.25.2",
     "vite-test-utils": "0.5.2",
-    "vitest": "0.23.2",
+    "vitest": "^0.24.5",
     "vite-plugin-vue2": "2.0.2",
     "vue-template-compiler": "2.6.14",
     "vue-tsc": "0.30.1"

playground/vue2/package.json

@@ -15,7 +15,7 @@
     "vue-router": "3.5.3",
     "vue-i18n": "^8",
     "vue-i18n-bridge": "^9.3.0-beta.6",
-    "vue-i18n-routing": "0.2.1"
+    "vue-i18n-routing": "0.8.0"
   },
   "devDependencies": {
     "@types/node": "^18.0.4",
@@ -26,7 +26,7 @@
     "vite": "2.9.12",
     "playwright": "1.25.2",
     "vite-test-utils": "0.5.2",
-    "vitest": "0.23.2",
+    "vitest": "^0.24.5",
     "vite-plugin-vue2": "2.0.2",
     "vue-template-compiler": "2.6.14",
     "vue-tsc": "0.30.1"

playground/vue2/src/router/index.ts

@@ -12,6 +12,7 @@ export function createRouter(i18n: I18n) {
   return _createRouter(i18n, {
     version: 3,
     defaultLocale: 'en',
+    // strategy: 'prefix',
     baseUrl: 'https://localhost:3000',
     locales: [
       {

playground/vue3-options/package.json

@@ -14,7 +14,7 @@
     "vue-router": "4.1.2",
     "vue-i18n": "^9.3.0-beta.6",
     "@vueuse/head": "0.7.6",
-    "vue-i18n-routing": "0.2.1"
+    "vue-i18n-routing": "0.8.0"
   },
   "devDependencies": {
     "@types/node": "^18.0.4",
@@ -26,7 +26,7 @@
     "vite": "3.1.2",
     "playwright": "1.25.2",
     "vite-test-utils": "0.5.2",
-    "vitest": "0.23.2",
+    "vitest": "^0.24.5",
     "vue-tsc": "0.40.3"
   }
 }

playground/vue3/package.json

@@ -14,7 +14,7 @@
     "vue-router": "4.1.2",
     "vue-i18n": "9.3.0-beta.6",
     "@vueuse/head": "0.7.6",
-    "vue-i18n-routing": "0.2.1"
+    "vue-i18n-routing": "0.8.0"
   },
   "devDependencies": {
     "@types/node": "^18.0.4",
@@ -26,7 +26,7 @@
     "vite": "3.1.2",
     "playwright": "1.25.2",
     "vite-test-utils": "0.5.2",
-    "vitest": "0.23.2",
+    "vitest": "^0.24.5",
     "vue-tsc": "0.40.3"
   }
 }

playground/vue3/src/router/index.ts

@@ -9,6 +9,8 @@ export function createRouter(i18n: I18n) {
   return _createRouter(i18n, {
     version: 4,
     defaultLocale: 'en',
+    // strategy: 'prefix',
+    // trailingSlash: true,
     baseUrl: 'https://localhost:3000',
     locales: [
       {