react-i18next addResourceBundle 不是函数

Question

我正在使用 react-i18next 来国际化我的 React 应用程序。当我尝试 addResourceBundle 每个模块的配置文件时，它会抛出此错误：

TypeError: i18next__WEBPACK_IMPORTED_MODULE_0__.default.addResourceBundle is not a function

因此，我在addResourceBundle之前添加了i18next.init命令。然后它可以工作，但会显示以下警告并重置之前选择的语言环境。

i18next: init: i18next is already initialized. You should call init just once!

这是我的 i18n.tsx 文件

import i18n from 'i18next'
import Backend from 'i18next-http-backend'
import LanguageDetector from 'i18next-browser-languagedetector'
import { initReactI18next } from 'react-i18next'

i18n
 .use(Backend)
 .use(LanguageDetector)
 .use (initReactI18next)
 .init({
   fallbackLng: 'en',
   debug: true,
   detection: {
    order: ['queryString', 'cookie'],
    cache: ['cookie']
  },
  interpolation: {
    escapeValue: false
  },
  react: {
    wait: true,
    useSuspense: false,
 }
})

export default i18n;

这是我模块的配置文件

import i18next from 'i18next';
import { lazy } from 'react';
import en from '../../i18n/dashboard/en';
import si from '../../i18n/dashboard/si';
import ta from '../../i18n/dashboard/ta';

i18next.init({ resources: {} });

i18next.addResourceBundle('en', 'dashboard', en);
i18next.addResourceBundle('si', 'dashboard', si);
i18next.addResourceBundle('ta', 'dashboard', ta);

const DashboardConfig = {
  settings: {
    layout: {
        mode : 'default'
    }
  },
  routes: [
    {
        path: '/dashboard',
        component: lazy(() => import('./Dashboard')),
        auth    : ['admin', 'user', 'DASHBOARD_VIEW'],
    }
  ]
};

export default DashboardConfig;

Answer 1

它会发生，因为您在模块中导入 i18next 而不是在 i18n.tsx 中创建实例。

应该是这样的：

import i18next from 'path/to/i18n.tsx';

react-i18next addResourceBundle 不是函数

react-i18next addResourceBundle is not a function

internationalization

i18next

reactjs