带有next-i18next的NextJS生成错误文本内容不匹配

Question

我想我已经完全按照他们的文档指定的方式设置了next-i18next，但是我收到了错误消息“text content not matching.server："Testing ZH HANT”Client："Testing EN“-前端只显示英文文本。我肯定遗漏了一些东西，但我终究看不到是什么。

以下是这些文件：

next-18next.config.js：

module.exports = {
    i18n: {
        locales: ['en-US', 'zh-hant', 'zh-hans'],
        defaultLocale: 'en-US',
        localeDetection: false
    },
};

next.config.js：

const { i18n } = require('./next-i18next.config');

module.exports = {
    images: {
        domains: ['mydomain.com'],
    },
    i18n,
    target: 'serverless'
}

_app.js：

import '../styles/globals.scss'
import Head from "next/head";
import { appWithTranslation } from 'next-i18next';

function MyApp({ Component, pageProps, mainMenu, footerMenu }) {
  return(
      <Component {...pageProps} />
  )
}

export default appWithTranslation(MyApp);

Article.js：

import { useTranslation } from 'next-i18next';

export default function Article(props){

    const node = props.node;
    const { t } = useTranslation(['common']);
return(
        <div>{t('Testing')}</div>
)}

export async function getStaticProps(context) {
    const { alias } = context.params;
    const lang = context.locale;
    const node = await restGet(`/endpoint?_format=json&slug=${alias.join('/')}&lang=${lang}`);
    const globals = await getGlobals(lang);
    const props = {
        ...{node: node},
        ...globals,
        ...(await serverSideTranslations(lang, ['common']))
    };

    return {
        props,
        revalidate: 5
    }
}

public/locales/zh-hant/common.json：

{
  "Testing": "Testing ZH HANS"
}

Answer 1

您是否尝试过在i18next配置文件中指定localePath？

const path = require('path')

module.exports = {
  ...
  localePath: path.resolve('./public/locales')
}

Answer 2

事实证明，zh-hant实际上应该是zh-Hant -它总是细节:)