将Next-I18Next与NextJ和Typescript配置

Question

使用NextJS和TypeScript上的Next-I18Next库，我遇到了底部报告的问题。我该如何修复？我还上传了使用库的文件的代码，这没什么特别的。

_app.tsx

import { appWithTranslation } from "next-i18next"

const MyApp = ({ Component, pageProps }: AppProps) => {
  return <Component {...pageProps} />
}

export default appWithTranslation(MyApp);

index.tsx

export const getStaticProps = async ({ locales }:{locales: string}) => {
    return {
        props: { ...(await serverSideTranslations(locales, ['common'])) }
    };
};

next-i18next.config.js

module.exports = {
    i18n: {
      defaultLocale: 'en',
      locales: ['en', 'it']
    },
} 

next.config.js

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

module.exports = {
    i18n
}

错误：

 Error: Initial locale argument was not passed into serverSideTranslations
enter code here

Answer 1

参数名称是语言环境而不是地方
。您正在通过当前的语言环境并非所有地区。我的代码段

index.tsx

 import { getStaticPropsTranslations } from '@/utils/i18n'    
 export async function getServerSideProps({ locale }: { locale: string }) {
    return {
        props: {
            ...(await getStaticPropsTranslations(locale)),
        },
    }
}

@/utils/i18n.ts

import { serverSideTranslations } from 'next-i18next/serverSideTranslations'

export const getStaticPropsTranslations = async (locale: string) => {
      return {
         ...(await serverSideTranslations(locale, ['instructions',])),
      }
}