时间戳

首页 > 解决方案 > react-i18next addResourceBundle 不是函数

reactjs - react-i18next addResourceBundle 不是函数

问题描述

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

TypeError: i18next__WEBPACK_IMPORTED_MODULE_0__.default.addResourceBundle 不是函数

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

i18next: init: i18next 已经初始化。您应该只调用一次 init！

这是我的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;

标签： reactjsinternationalizationi18next

解决方案

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

它应该是这样的：

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

推荐阅读