How to use i18next-icu - 5 common examples

import i18n from 'i18next';
import Backend from 'i18next-xhr-backend';
import LanguageDetector from 'i18next-browser-languagedetector';
import { reactI18nextModule } from 'react-i18next';

import ICU from 'i18next-icu';
import de from 'i18next-icu/locale-data/de'; // or dynamically like: https://github.com/locize/locize-react-intl-example/blob/master/src/locize/index.js#L53

i18n
  .use(
    new ICU({
      localeData: de, // you also can pass in array of localeData
    }),
  )
  .use(Backend)
  .use(LanguageDetector)
  .use(reactI18nextModule)
  .init({
    fallbackLng: 'en',

    // have a common namespace used around the full app
    ns: ['translations'],
    defaultNS: 'translations',

    nsSeparator: false,
    keySeparator: false,

import i18n from 'i18next'
import ICU from 'i18next-icu'
import XHR from 'i18next-xhr-backend'
import LanguageDetector from 'i18next-browser-languagedetector'

// Locales
import en from 'i18next-icu/locale-data/en'
import pt from 'i18next-icu/locale-data/pt'

i18n
  .use(new ICU({
    localeData: [en, pt]
  }))
  .use(XHR)
  .use(LanguageDetector)
  .init({
    fallbackLng: {
      'zh-Hans': ['zh-CN', 'en'],
      'zh-Hant': ['zh-TW', 'en'],
      'zh': ['zh-CN', 'en'],
      'default': ['en']
    },
    debug: process.env.NODE_ENV !== 'production',
    backend: {
      // ensure a realtive path is used to look up the locales, so it works when used from /ipfs/
      loadPath: 'locales/{{lng}}/{{ns}}.json'
    },

import pt from 'i18next-icu/locale-data/pt'
import sv from 'i18next-icu/locale-data/sv'
import zh from 'i18next-icu/locale-data/zh'

const localeData = [cs, da, de, en, es, fr, ko, nl, no, pl, pt, sv, zh]

export const localesList =
  // add here the language variants
  ['ko-KR', 'zh-CN', 'zh-TW']
    .concat(localeData.map((locale) => locale[0].locale))
    // add here languages you want to exclude
    .filter(item => !['ko', 'zh'].includes(item))
    .sort()

i18n
  .use(new ICU({ localeData: localeData }))
  .use(XHR)
  .use(LanguageDetector)
  .init({
    ns: ['app', 'welcome', 'status', 'files', 'explore', 'peers', 'settings', 'notify'],
    fallbackLng: {
      'zh-Hans': ['zh-CN', 'en'],
      'zh-Hant': ['zh-TW', 'en'],
      zh: ['zh-CN', 'en'],
      default: ['en']
    },
    debug: process.env.NODE_ENV !== 'production',
    backend: {
      // ensure a relative path is used to look up the locales, so it works when used from /ipfs/
      loadPath: 'locales/{{lng}}/{{ns}}.json'
    },
    // react i18next special options (optional)

export default async function () {
  await i18n
    .use(new ICU({ localeData: localeData }))
    .use(Backend)
    .init({
      lng: store.get('language'),
      fallbackLng: {
        default: ['en']
      },
      backend: {
        loadPath: join(__dirname, '../assets/locales/{{lng}}.json')
      }
    })

  ipcMain.on('updateLanguage', async (_, lang) => {
    if (lang === store.get('language')) {
      return
    }

export default async function () {
  await i18n
    .use(new ICU({ localeData: localeData }))
    .use(Backend)
    .init({
      lng: store.get('language'),
      fallbackLng: {
        default: ['en']
      },
      backend: {
        loadPath: join(__dirname, '../assets/locales/{{lng}}.json')
      }
    })

  ipcMain.on('updateLanguage', async (_, lang) => {
    if (lang === store.get('language')) {
      return
    }