this is a webpack loader that can translate your code and generate bundle per each language
npm install --save-dev i18next-loader
- install
i18next1
:npm install --save-dev i18next
- call
i18next.init({})
in the begining of yourwebpack.config.js
:
var i18next = require('i18next');
i18next.init({
lng: 'pl',
fallbackLng: false,
keySeparator: false,
nsSeparator: false,
saveMissing: true,
resources: {
'Hello World!': 'Siema Świecie!',
'Translate me!': 'Przetłumacz mnie',
'One plus one equals ${ 1 + 1 }': 'Jeden plus jeden jest równe ${ 1 + 1 }',
'key_0': 'elementów',
'key_1': 'element',
'key_2': 'elementy',
'key_5': 'elementów',
'key_21': 'elementy'
}
});
- Use loader in your application:
- using
require
:
var exportsOfFile = require("i18next!./file.js");
- using webpack config:
{
test: /\.(js|jsx)$/,
loader: 'i18next-loader!react-hot!babel-loader'
}
- Then you can use translate function, e.g:
__('Translate me!') // 'Przetłumacz mnie'
__(`One plus one equals ${ 1 + 1 }`) // 'Jeden plus jest jest równe ${ 1 + 1 }'
__('item', {count: 0}) // 'elementów'
__('item', {count: 1}) // 'element'
__('item', {count: 99}) // 'elementów'
funcName
: change default function name (default is__()
)quotes
: choose how to generates translated strings in code (default is''
)lng
: set i18next language (useful when having webpack config per language)
- it will not translate keys depending of variables values: it is a loader so the value of the variable is unknown in the process of loading file. (to handle it we need to use i18next directly)