Issue with the newest router

[Mister-Hope]

• [x] I confirm that this is an issue rather than a question.

Bug report

The newest vue-router triggers an warning when navigating to routes with special charaters.

And it's common for Chinese. Japanese or other users to use their language in tags and categories.

E.g.:

---
tags:
  - 笔记
  - 随笔
---

And this plugin is generating links like /tag/笔记/ now, so issues will be shown in dev mode.

This issue is not an actual issue in the past few months before I run yarn upgrade and updated my deps to newest (3.4.9).

So I believe a version between 3.4.6-3.4.8 is showing isssues but works well.

With the newest deps, links like /tag/使用指南/ can be visited through other pages, but will break when visiting directly.

Reproduce: If you visite https://vuepress-theme-demo.mrhope.site/ and press the 使用指南 here, everything is prefect

But if you visit https://vuepress-theme-demo.mrhope.site/tag/使用指南/ directly, you will get a 404.

Besides if you disable javascript, you can find out that layout is rendered correctly by SSR, and client-side hydration leads to the 404 pages:

SSR render result. (Visit https://vuepress-theme-demo.mrhope.site/tag/使用指南/ when disabling JavaScript)

Other relevant information

• npx vuepress info:

  System:
    OS: Windows 10 10.0.19042
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz 
  Binaries:
    Node: 14.15.4 - C:\Program Files\nodejs\node.EXE       
    Yarn: 1.22.5 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 7.3.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: Not Found
    Edge: Spartan (44.19041.423.0), Chromium (87.0.664.75) 
  npmPackages:
    @vuepress/core:  1.8.0
    @vuepress/theme-default:  1.8.0
    vuepress:  1.8.0
  npmGlobalPackages:
    vuepress: Not Found

Config:

         {
            frontmatters: [
              {
                id: "tag",
                keys: ["tag", "tags"],
                path: "/tag/",
                layout: "Blog",
                scopeLayout: "Blog",
              },
              {
                id: "category",
                keys: ["category", "categories"],
                path: "/category/",
                layout: "Blog",
                scopeLayout: "Blog",
              },
            ],
          }

[Mister-Hope]

Addtional info:

I tested , and issue will hapens when using 3.4.9, while disapear with 3.4.5

So these updates about path and query encode/decode is effecting this plugin.

3.4.9 (2020-11-05)

Bug Fixes

• encoding: decode params (#3350) (63c749c)

3.4.8 (2020-10-26)

Features

• scroll: add behavior support on scrollBehavior (#3351) (4e0b3e0)

3.4.7 (2020-10-16)

Bug Fixes

• matcher: should try catch decode only (1f32f03)
• query: check existing keys (4b926e3), closes #3341

3.4.6 (2020-10-07)

Bug Fixes

• encoding: try catch decodes (607ce2d)
• ssr: memory leak in poll method (#2875) (7693eb5)
• remove duplicated decodeURIComponent (#3323) (560d11d)

I think a possible fix is to encode all the classifierr key before generating related routes.

[billyyyyy3320]

Thanks for the report and detailed information.

[Mister-Hope]

Any update with this? @billyyyyy3320 This bug can be considered as a critical one, because we cannot visit path like /tag/使用指南/ directly.

After half a year, do you still have plans to fix it? Or shall I publish a fixed version under my namespace? ( I hate duplicated versions of something)