Introduction
This package helps to transform resources to an i18next backend. To be used in Node.js, in the browser and for Deno.
Getting started
Source can be loaded via npm.
$ npm install i18next-resources-to-backend
simple example - dynamic imports (lazy load in memory translations)
i18next-resources-to-backend helps to transform resources to an i18next backend. This means you can lazy load translations.
The dynamic import must be passed a string. Webpack will fail to load the resource if you pass a variable to import()
.
For example, when using webpack:
import i18next from 'i18next';
import resourcesToBackend from 'i18next-resources-to-backend';
i18next
.use(resourcesToBackend((language, namespace) => import(`./locales/${language}/${namespace}.json`)))
.on('failedLoading', (lng, ns, msg) => console.error(msg);
.init({ })
used as fallback in combination with another i18next backend
i.e. Browser fallback with local / bundled translations
Wiring up:
import i18next from 'i18next'
import ChainedBackend from 'i18next-chained-backend'
import resourcesToBackend from 'i18next-resources-to-backend'
import HttpBackend from 'i18next-http-backend'
i18next.use(ChainedBackend).init({
backend: {
backends: [
HttpBackend,
resourcesToBackend({
en: {
translations: {
sayHi: 'hello world'
}
}
})
],
backendOptions: [{
loadPath: 'http://localhost:8080/locales/{{lng}}/{{ns}}.json'
}]
}
})
for Deno:
import i18next from 'https://deno.land/x/i18next/index.js'
import ChainedBackend from 'https://deno.land/x/i18next_chained_backend/index.js'
import resourcesToBackend from 'https://deno.land/x/i18next_resources_to_backend/index.js'
import HttpBackend from 'https://deno.land/x/i18next_http_backend/index.js'
i18next.use(ChainedBackend).init({
backend: {
backends: [
HttpBackend,
resourcesToBackend({
en: {
translations: {
sayHi: 'hello world'
}
}
})
],
backendOptions: [{
loadPath: 'http://localhost:8080/locales/{{lng}}/{{ns}}.json'
}]
}
})
you can also lazy load the in memory translations, i.e. when using webpack:
i18next.use(ChainedBackend).init({
backend: {
backends: [
HttpBackend,
resourcesToBackend((language, namespace) => import(`./locales/${language}/${namespace}.json`))
],
backendOptions: [{
loadPath: 'http://localhost:8080/locales/{{lng}}/{{ns}}.json'
}]
}
})
From the creators of i18next: localization as a service - locize.com
A translation management system built around the i18next ecosystem - locize.com.
With using locize you directly support the future of i18next.