i18nFormat plugin to use ICU format with i18next
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
locale-data
src
test
.babelrc
.coveralls.yml
.editorconfig
.eslintignore
.eslintrc
.gitignore
.npmignore
.travis.yml
CHANGELOG.md
LICENSE
README.md
i18nextICU.js
i18nextICU.min.js
index.js
karma.conf.js
package.json
rollup.config.js

README.md

Introduction

Travis Coveralls npm version David

This changes i18n format from i18next json to ICU using yahoo/intl-messageformat

Getting started

Source can be loaded via npm or downloaded from this repo.

# npm package
$ npm install i18next-icu

Wiring up:

import i18next from "i18next";
import ICU from "i18next-icu";

i18next.use(ICU).init(i18nextOptions);
  • As with all modules you can either pass the constructor function (class) to the i18next.use or a concrete instance.
  • If you don't use a module loader it will be added to window.i18nextICU

Plural Support

  • While on node.js all plurals will work out of the box in browser you will need to load additional locale data files like:
import i18next from 'i18next';
import ICU from 'i18next-icu';

import fr from 'i18next-icu/locale-data/fr';

i18next
  .use(ICU)
  .init({
    i18nFormat: {
      localeData: fr // you also can pass in array of localeData
      formats: {
        // https://github.com/yahoo/intl-messageformat#user-defined-formats
      }
    }
  });

// or for react-i18next when using SSR
import i18next from 'i18next';
import ICU from 'i18next-icu';
import fr from 'i18next-icu/locale-data/fr';

const icu = new ICU();
icu.addLocaleData(fr);
icu.addUserDefinedFormats({ /* https://github.com/yahoo/intl-messageformat#user-defined-formats */ })

i18next
  .use(icu)
  .init({
    i18nFormat: {}
  });

Backend Options

{
  // per default icu functions are parsed once and cached for subsequent calls
  memoize: true,

  // memoize if not having a lookup and just using the key fallback as value
  memoizeFallback: false,

  // array or single object of loaded 'i18next-icu/locale-data
  localeData: null
}

Options can be passed in by setting options.i18nFormat in i18next.init:

import i18next from "i18next";
import ICU from "i18next-icu";

i18next.use(ICU).init({
  i18nFormat: options
});

more complete sample

import i18next from "i18next";
import ICU from "i18next-icu";

i18next.use(ICU).init({
  lng: "en",
  resources: {
    en: {
      translation: {
        key:
          "You have {numPhotos, plural, " +
          "=0 {no photos.}" +
          "=1 {one photo.}" +
          "other {# photos.}}"
      }
    }
  }
});

i18next.t("key", { numPhotos: 1000 }); // -> You have 1,000 photos.

Gold Sponsors