@shore/i18n
v1.2.0
Published
A wrapper around some *i18next* functionality - encapsulating *namespaced* translations.
Downloads
54
Readme
i18n
A wrapper around some i18next functionality - encapsulating namespaced translations.
Usage
Translation file ./de/translation.json
:
{
"english": "Englisch"
}
Translation file ./de/my-namespace.json
:
{
"Hello world!": "Hallo Welt!"
}
Application example:
import i18n from '@shore/i18n';
i18n.init({
locale: 'de',
...
})
.then(() => {
console.log(i18n.locale); // -> 'de'
console.log(i18n.t('english')); // -> 'Englisch'
return i18n.loadNamespace('my-namespace');
})
.then((i18nNamespaced) => {
console.log(i18nNamespaced.t('Hello world!')); // -> 'Hallo Welt!'
});
If i18next should not be bundled because the embedding page already made it globally available through window.i18n
and called init
on it, use:
import i18n from '@shore/i18n/no-bundled-i18next';
console.log(i18n.locale); // -> 'de'
i18n.loadNamespace('my-namespace')
.then((i18nNamespaced) => {
console.log(i18nNamespaced.t('Hello world!')); // -> 'Hallo Welt!'
});
If you want to conveniently use namespaced version of t
and exists
across modules:
// i18n.js
import i18n from '@shore/i18n/no-bundled-i18next';
const namespace = 'my-namespace';
export default i18n;
export function loadDefaultNamespace() {
return i18n.loadNamespace(namespace);
}
export const i18nNamespaced = i18n.useNamespace(namespace);
// my-module.js
import { i18nNamespaced as i18n } from './i18n';
export function helloWorld() {
return i18n.t('Hello World!');
}
// main.js
import { loadDefaultNamespace } from './i18n';
import { helloWorld } from './my-module';
loadDefaultNamespace().then(() => {
console.log(helloWorld()); // -> 'Hallo Welt!'
});