Update 5 April '18 :
react-native-i18n-complete-corrected
This npm includes a correction over react-native-i18n-complete npm from given link https://www.npmjs.com/package/react-native-i18n-complete :-
Problem in Android : -
- In “react-native-i18n-complete” library there is the entry of android:icon="@mipmap/ic_launcher" in “AndroidManifest.xml”, because of this entry there is a confliction for android:icon b/w react-native-i18n-complete’s AndroidManifest.xml file and your main application AndroidManifest.xml file.
Resolution for Android : -
- Removed the entry of android:icon="@mipmap/ic_launcher" from “AndroidManifest.xml” because most of the time every react native have unique android:icon in “android/app/src/main/AndroidManifest.xml” file.
react-native-i18n
Integrates I18n.js with React Native. Uses the device's locale as default.
Installation
$ npm install react-native-i18n-complete-corrected --save
After installing the npm package you need to link the native modules. You can do so using rnpm.
$ rnpm link react-native-i18n-complete-corrected
Or you can do it manually as follows:
- iOS
Add RNI18n.xcodeproj
to Libraries and add libRNI18n.a
to Link Binary With Libraries under Build Phases. More info and screenshots about how to do this is available in the React Native documentation.
-
Android
-
android/settings.gradle
...include ':react-native-i18n-complete-corrected'project(':react-native-i18n-complete-corrected').projectDir = new File(settingsDir, '../node_modules/react-native-i18n-complete-corrected/android')
android/app/build.gradle
dependencies { ... compile project(':react-native-i18n-complete-corrected')}
- register module (in MainActivity.java)
... // <--- import
Usage
var I18n = ; var Demo = React; // Enable fallbacks if you want `en-US` and `en-GB` to fallback to `en`I18nfallbacks = true; I18ntranslations = en: greeting: 'Hi!' fr: greeting: 'Bonjour!'
This will render Hi!
for devices with the English locale, and Bonjour!
for devices with the French locale.
Fallbacks
When fallbacks are enabled (which is generally recommended), i18n.js
will try to look up translations in the following order (for a device with en_US
locale):
- en-US
- en
Note: iOS locales use underscored (en_US
) but i18n.js
locales are dasherized (en-US
). This conversion is done automatically for you.
I18nfallbacks = true; I18ntranslations = 'en': greeting: 'Hi!' 'en-GB': greeting: 'Hi from the UK!'
For a device with a en_GB
locale this will return Hi from the UK!'
, for a device with a en_US
locale it will return Hi!
.
Device's locale
You can get the device's locale with the RNI18n
native module:
var deviceLocale = NativeModulesRNI18nlocale
Returns en_US
.
I18n.js documentation
For more info about I18n.js methods (localize
, pluralize
, etc) and settings see its documentation.
Licence
MIT