How to setup react-native-localization for react native app?

Step 1: Open your react-native project

• If you have already a react-native project then open root directory of your package
• In case if you didn't have created a react-native project then use react-native init project_name and then navigate to your root directory by cd project_name and run npm install for initial setup.

Step 2: Install react-native-localization package in the project

To install the react-native-localization run npm install react-native-localization --save in root directory of your project.

Step 3: Link react-native-localization package in the project

For Android App

To link react-native-localization app on android use react-native link react-native-localization and it will apply all the necessary changes to link your library on the Android app. In case if automatic linking creating the issue in android app then try manual linking as mentioned in react-native-localization docs.

For iOS App

Linking Issue in iOS

When you run react-native link react-native-localization command then it also applies the changes on ios app which created an issue in our case. It creates an entry in project_name → ios → podfile

Here ReactNativeLocalization is pointing to project_name/node_modules/react-native-localization directory. Due to this line, whenever we run pod install command then there is one dependency i.e. React is going to be reinstalled in your pods as you can see in this image.

This duplicate package in pods sometimes create issues like multiple command produced with libReactNativeLocalization.a and when you remove this library from xcode → target → Build Phase → Link Binary with Libraries then it will create another issue like no such file or directory: '/Users/...../DerivedData/myproject/Build/Products/Release-iphonesimulator/libReactNativeLocalization.a'.

Solution for Linking Issue in iOS

To overcome from this issue, follow the below mentioned steps:

• After running react-native link react-native-localization command, navigate to project_name → ios → podfile. Remove or comment pod 'ReactNativeLocalization', :path => '../node_modules/react-native-localization'

• Once you remove or comment this line, then run pod install command. Now no duplicate dependency will going to install. It will fix multiple command produced problem.

• Now it's time to link react-native-localization library manually from Xcode. To link this library manually, open project_name → ios → project_name.xcworksace (if exist) or project_name → ios → project_name.xcodeproj (if .xcworkspace file doesn't exist) file in Xcode and select your target.

• After that in project navigator right click on library and select Add Files to project_name and after that navigate to project_name → node_modules → react-native-localization and select ReactNativeLocalization.xcodeproj file.

• Now navigate to project Target → Build Phases and expand Link Binary With Libraries after that click on plus icon and add libReactNativeLocalization.a library

Step 4: Build and Archive the App

Now you can clean the build by clicking on Product → clean build folder and build the app from Product → Build.

That's it and now the app will start running without any error.