next-i18next 在构建期间使用了错误的资源设置

问题描述

我有一个使用子路径路由的具有 4 个语言环境的应用程序。在开发过程中它运行良好，但在构建过程中使用了错误的语言环境集。这会导致页面加载错误翻译，然后转向更正导致闪烁的页面。这发生在本地和生产中（我使用 vercel）。而且它不依赖于活动的子路径（我在 example.com、example.com/fr 等上获得随机页面版本）。

我的next-i18next.config.js

const path = require("path");

module.exports = {
  // config for next's internationalized routing
  i18n: {
    defaultLocale: "en",locales: ["en","de","fr","cn"],localeDetection: false,},// config for i18next
  localePath: path.resolve("./src/locales"),fallbackLng: "en",defaultNS: [],};

我的 getStaticProps src/pages/index.tsx

export const getStaticProps: GetStaticProps = async ({ locale }) => {
  console.log("getting static props for",locale);
  return {
    props: {
      ...(await serverSideTranslations(locale!,[
        "navigation","fileTypes","features","footer",])),};
};

然后是我的 src/pages/index.tsx 本身

const IndexPage = () => {
  const { locale } = useRouter();
  console.log('rendering index page for',locale);

  return <div><Navbar /></div>
}

和src/components/Navbar

const Navbar = () => {
  const { locale } = useRouter();
  const { t } = useTranslation('navigation');

  console.log(`from nav: locale is ${locale} and translation is ${t('navigation:pricing')}`);

  return <nav>...</nav>
}

现在，当我进行下一次构建时，我会按以下顺序收到消息：

getting static props for en
getting static props for de
getting static props for fr
getting static props for cn
from nav: locale is en and translation is Tarifs
rendering index page for en
from nav: locale is de and translation is Tarifs
rendering index page for de
from nav: locale is fr and translation is Preise
rendering index page for fr
from nav: locale is cn and translation is Preise
rendering index page for cn

我已经为此问题苦苦挣扎了几天，但找不到任何可能导致此问题的原因。任何想法我做错了什么？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）