next-i18next ошибка 404 при попытке доступа к любой странице с предоставленной конфигурацией localeSubpaths

Я сталкиваюсь с проблемой 404 при попытке получить доступ к любой странице моего приложения Next.js.

Приложение работает нормально, когда не указан localeSubpaths config.

После реализации конфигурации localeSubpaths (next.config.js):

const localeSubpaths = {
  en: "en",
  "de-DE": "de-DE",
  fr: "fr"
};

приложение больше не работает.

Каждый раз, когда я пытаюсь получить доступ к основному корневому каталогу / или к любой из страниц локали fr, браузер de-DE отображает страницу ошибки 404 (настраиваемая страница ошибок Next.js). Эта страница содержит переведенный контент, который отлично работает.

Страница также содержит ссылку на / домашнюю страницу. Когда я перехожу на главную страницу, щелкая ссылку - ›Домашняя страница загружается правильно (включая связанные переводы)

i18n.tsx конфигурационный файл:

import NextI18Next from "next-i18next";
import getConfig from "next/config";
import path from "path";

const { publicRuntimeConfig } = getConfig();
const { localeSubpaths } = publicRuntimeConfig;

const NextI18NextInstance = new NextI18Next({
  defaultLanguage: "en",
  ns: ["common"],
  defaultNS: "common",
  otherLanguages: ["de-DE", "de-CH", "fr"],
  strictMode: false,
  localeSubpaths,
  localePath: path.resolve("./public/static/locales")
});

export default NextI18NextInstance;

const {
  appWithTranslation,
  i18n,
  Link,
  withTranslation,
  Router
} = NextI18NextInstance;

export { appWithTranslation, i18n, Link, withTranslation, Router };

javascript next.js internationalization react-i18next next-i18next
person Piotr O    schedule 24.08.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Убедитесь, что вы не определили запись i18n в файле next.config.js, поскольку она будет перекрываться с записью перенаправления.

next.config.js

const localeSubpaths = {
  en: 'en',
  es: 'es'
}
[...]
//remove any reference to this entry
//i18n: [...]
rewrites: async () => nextI18NextRewrites(localeSubpaths),
  publicRuntimeConfig: {
    localeSubpaths,
  }

i18n.ts

import NextI18Next from 'next-i18next'
import path from 'path'
 
const localeSubpaths = {
  en: 'en',
  es: 'es'
}

const NextI18NextInstance = new NextI18Next({
  browserLanguageDetection: false,
  ns: ["common"],
  defaultNS: "common",
  fallbackLng: 'en',
  otherLanguages: ['es'],
  localeSubpaths: localeSubpaths,
  defaultLanguage: 'en',
  localePath: path.resolve('./public/locales'),
})

export const { appWithTranslation, useTranslation, withTranslation, Link, i18n} = NextI18NextInstance;
export default NextI18NextInstance;
person makgyverzx    schedule 18.11.2020