i18next instance
The instance is an initialized i18next instance. In the following code snippet, we add a backend to load translations from server and a language detector for detecting user language.
You can learn more about i18next and plugins on the i18next website.
1
import i18n from 'i18next';
2
import Backend from 'i18next-http-backend';
3
import LanguageDetector from 'i18next-browser-languagedetector';
4
import { initReactI18next } from 'react-i18next';
5
6
7
i18n
8
.use(Backend)
9
.use(LanguageDetector)
10
.use(initReactI18next) // bind react-i18next to the instance
11
.init({
12
fallbackLng: 'en',
13
debug: true,
14
15
interpolation: {
16
escapeValue: false, // not needed for react!!
17
},
18
19
// react i18next special options (optional)
20
// override if needed - omit if ok with defaults
21
/*
22
react: {
23
bindI18n: 'languageChanged',
24
bindI18nStore: '',
25
transEmptyNodeValue: '',
26
transSupportBasicHtmlNodes: true,
27
transKeepBasicHtmlNodesFor: ['br', 'strong', 'i'],
28
useSuspense: true,
29
}
30
*/
31
});
32
33
34
export default i18n;
Copied!
All additional options for react in init options:
options
default
description
bindI18n
'languageChanged'
which events trigger a rerender, can be set to false or string of events separated by ""
bindI18nStore
''
define which events on resourceStore should trigger a rerender
transEmptyNodeValue
''
how to treat failed lookups in Trans component
transSupportBasicHtmlNodes
true
convert eg. <br/> found in translations to a react component of type br See Trans component
transKeepBasicHtmlNodesFor
['br', 'strong', 'i', 'p']
Which nodes not to convert in defaultValue generation in the Trans component. See Trans component
useSuspense
true
If using Suspense or not
For more initialization options have look at the docs.
Last modified 1yr ago
Copy link