eig

eighteen

A simple, elegant, i18n library for ReactJS.

Showing:

Popularity

Downloads/wk

11

Maintenance

No Maintenance Data Available

Package

Dependencies

1

License

ISC

Type Definitions

Tree-Shakeable

No?

Categories

Readme

Eighteen

A simple, elegant, i18n library for ReactJS.

Principles

Eighteen is written to get out of your way, make internationalisation of your React apps easy, and keep your code readable.

It's light, and has no dependencies.

Get Started

Install Eighteen:

npm install --save eighteen

Configure:

import Eighteen from 'eighteen';

Eighteen.configure({
  locales: {
    'fr-FR': {
      'Hello': 'Bonjour'
    }
  }
});

Use:

import { Text } from 'eighteen';

class MyComponent extends Component {
  render() {
    return (
      <Text locale="fr-FR">Hello</Text>
    );
    // Renders:
    // <span>Bonjour</span>
  }
}

Configuration

Eighteen.configure takes the following options.

locales (Object)

An object, where each key is the locale identifier (e.g. en-GB) and the values are a key-value list of translations.

Translations are keyed by the default translation, and the value is the locale-specific translation. For example, if your default translation is en-GB, your fr-FR configuration might look like this:

locales: {
  'fr-FR': {
    'Hello': 'Bonjour'
  }
}

defaultLocale (string)

The default locale key to use when a locale prop is not passed to the Test component.

Advanced Formatting

You can provided advanced formatting for your translations by providing an args which replaces the format indicators in the order they are given.

<Text args={[ 1 ]}>You have %s new message(s)</Text>
// <span>You have 1 new message(s)</span>

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100