i18n module throws NavigationDuplicated while accessing non-existent routes (404) causing infinite loading screen

[liyasthomas]

Version

nuxt-i18n: 6.11.0
nuxt: 2.12.2

Reproduction Link

Any 404 page: https://postwoman.io/this-page-dont-exist

Steps to reproduce

1. Visit a 404 page: https://postwoman.io/this-page-dont-exist
2. Error page (error.vue) is not not loaded - showing infinite loading screen

What is Expected?

404 page (error.vue) should be visible.

What is actually happening?

i18n module throws this error to console and shows infinite loading screen:

[rchl]

I need more info. It doesn't reproduce on https://codesandbox.io/s/i18n-plugin-i18nlocales-ouwhn?file=/nuxt.config.js

You can fork the codesandbox and reproduce there maybe? Otherwise, at least provide the configuration object that you are using.

[liyasthomas]

@rchl this is my i18n configuration in nuxt.config.js

  i18n: {
    locales: [
      {
        code: "en",
        name: "English",
        iso: "en-US",
        file: "en-US.json",
      },
      {
        code: "es",
        name: "Español",
        iso: "es-ES",
        file: "es-ES.json",
      },
      {
        code: "fr",
        name: "Français",
        iso: "fr-FR",
        file: "fr-FR.json",
      },
      {
        code: "fa",
        name: "Farsi",
        iso: "fa-IR",
        file: "fa-IR.json",
      },
      {
        code: "pt",
        name: "Português",
        iso: "pt-PT",
        file: "pt-PT.json",
      },
      {
        code: "pt-br",
        name: "Português Brasileiro",
        iso: "pt-BR",
        file: "pt-BR.json",
      },
      {
        code: "cn",
        name: "简体中文",
        iso: "zh-CN",
        file: "zh-CN.json",
      },
      {
        code: "tw",
        name: "繁體中文",
        iso: "zh-TW",
        file: "zh-TW.json",
      },
      {
        code: "id",
        name: "Bahasa Indonesia",
        iso: "id-ID",
        file: "id-ID.json",
      },
      {
        code: "tr",
        name: "Türkçe",
        iso: "tr-TR",
        file: "tr-TR.json",
      },
      {
        code: "de",
        name: "Deutsch",
        iso: "de-DE",
        file: "de-DE.json",
      },
      {
        code: "ja",
        name: "日本語",
        iso: "ja-JP",
        file: "ja-JP.json",
      },
      {
        code: "ko",
        name: "한국어",
        iso: "ko-KR",
        file: "ko-KR.json",
      },
    ],
    defaultLocale: "en",
    vueI18n: {
      fallbackLocale: "en",
    },
    lazy: true,
    langDir: "lang/",
  },

I suspect this issue have been introduced apparently in the latest i18n releases.