Duplicate route names with prefix_and_default strategy

Version

v5.3.0

Reproduction link

https://codesandbox.io/s/ql7wx2mvk6

Steps to reproduce

1. Configure nuxt-i18n module with these settings:

    [
      "nuxt-i18n",
      {
        locales: [
          { code: "pt", iso: "pt-PT", file: "pt.json" },
          { code: "us", iso: "en-US", file: "en.json" }
        ],
        langDir: "locales/",
        lazy: true,
        strategy: "prefix_and_default",
        defaultLocale: "us"
      }
    ]

1. Load the root path.
2. Look at the console (the server one, at the bottom of the codesandbox UI)

What is expected ?

No warnings about duplicated routes.

What is actually happening?

Getting console warnings:

[vue-router] Duplicate named routes definition: { name: "about___us", path: "/us/about" } 
[vue-router] Duplicate named routes definition: { name: "index___us", path: "/us" }

Additional comments?

Appears to be due to using strategy: "prefix_and_default", setting which creates routes with duplicate names for default locale.

<div align="right">_{This bug report is available on Nuxt community (#c153)}</div>

[ruzpuz]

I am experiencing this issue as well… any way around it?

[ghost]

Another alternative to the above solution is to use routes.push({ ...route, path }) instead of routes.push({ ...localizedRoute, path }). This will still create a new route for the default route (which you might want for e.g. SEO purposes) but its name will be set to the base name of the route. For example, a contact route is currently generated into e.g. contact___en, but with this change the default locales routes name would just be contact.

Note that localePath will still move you to e.g. /en/contact from /contact, I still need to find a solution to that.