1
2
3
4
5
6
7
8
9

import { I18nextProvider } from 'react-i18next';
import i18n from './_i18n';

const root = createRoot(document.getElementById('root'));
root.render(
  <I18nextProvider i18n={ i18n } >
     <App/>
  </I18nextProvider>
);

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

import i18n from 'i18next';
import Backend from 'i18next-xhr-backend';
import LanguageDetector from 'i18next-browser-languagedetector';
import { initReactI18next } from 'react-i18next';
import { mediaUrl } from '../utils/constants';

i18n
  .use(Backend)
  .use(LanguageDetector)
  .use(initReactI18next)
  .init({
    lng: lang,
    fallbackLng: 'en',
    ns: ['editor'],
    defaultNS: 'editor',
    whitelist: ['en', 'zh-CN', 'fr', 'de', 'cs', 'es'],
    backend: {
      loadPath: mediaUrl + '{{ ns }}/locales/{{ lng }}/{{ ns }}.json',
    },
    debug: false, // console log if debug: true
    interpolation: {
      escapeValue: false, // not needed for react!!
    },
    load: 'currentOnly',
    react: {
      wait: true,
    }
  });

export default i18n;