react-i18n

React i18n

npm i r-i18n --save

Usage

``jsx
import React from 'react'

import {
createI18n
debug,
} from 'r-i18n'
`

Samples

#### init
Use Jed to initialize i18n in your project.

`jsx
const i18n = createI18n({ / jed options / }))
`

#### t

Component as placeholder

`jsx
const {t} = i18n

t('Welcome to Strikingly')
// -> '欢迎使用 Strikingly'

t('Welcome to Strikingly, %{username}', { username: 'Shu' })
// -> '欢迎使用 Strikingly，Shu'

// React component as placeholder

t('%{author} assigned this event to %{assignee}', {
author: ,
assignee: example@example.com
})
// -> [, ' assigned this event to ', example@example.com]
`

#### tct

HTML inside translated string with a root wrapper

`jsx
const {tct} = i18n

//...

tct('Welcome. Click [link:here]', {
root:

,
link:
})
// ->

欢迎。点击 此处 继续。


`

$3

Wrap t and tct with a wrapper

(for React Native, it just appends a flag emoji to the message)

`jsx
import {createI18n, debug} from 'r-i18n'

//...
const i18n = createI18n({ / jed options / }))
debug()

i18n.tct('Welcome. Click [link:here]', {
root:

,
link:
})
// ->
//

欢迎。点击 此处 继续。


//
`

React Native

React-i18n works both with React and React Native.
For React Native, use npm i rn-i18n --save.

React Native branch: react-native

Syntax

r-i18n uses %{} to pass args.
__And use %% to escape %__.

i.e. t('%{percentage}%% correct', { percentage: 100 }) -> '100% correct'`

Acknowledgement

#### Sentry

Post about i18n and React on Sentry blog: link.

Sentry source code on GitHub.

License of Sentry.

#### sprintf.js

License of sprintf.js