DEV Community

Kovacs Nicolas
Kovacs Nicolas

Posted on • Originally published at Medium on

react-native-localize and i18n-js

Photo by Kyle Glenn on Unsplash

Initially posted on Medium

Recently react-native-i18n has been deprecated in favor of react-native-localize , here is how you can keep the same logic as before without recode It all over again. It’s the simplest way I could found.

First, install the new dependencies. You should unlink react-native-i18n if you had It and link the new ones.

yarn add react-native-localize

yarn add i18n-js

You should have in your package.json something like this :

If you are using react-native ≥ 0.60 you don’t need linking anymore and you can pass the next quoted step.

Don’t forget to link new dependencies, for more informations go to github pages linked above.

react-native link

Now create a file where you will initialize i18n-js , let’s call It i18n.js for example in a src/utils folder

Now in the same folder create a new one named locales for example and create a new file for each locale you want.

Example of en.js

Example of fr.js

Don’t forget If you add more locales to import them in i18n.js

Now in any component of your app, import the file created in the first step and initiate I18n as before

If you want to get current locale you can use

That’s all, I hope It will help you to understand how to achieve It. Any comments or recommandations are welcome

Happy coding ;)

Top comments (1)

Collapse
 
kris profile image
kris

A quick tutorial on React Native Localize package. That’s how I like it. Short, quick, easy to understand. The use of React Native localize package instead of deprecated react-native-i18n is highly recommended.