Let's resolve frequent issues in react-native

Jayasingh
3 min readMar 7, 2020

--

I just published our android and ios build for a project developed in React native. And this was a long 20 hours work to fix build issues reoccurring due to fellow developers changing the code or removing some assets. In this article, I am going to list all the silly to major issues that occurred and how I overcame all of them.

This bundle name already exists

I have updated the android package name and as well as the bundle id and display name in ios project. But this error was getting thrown at face for hours. (IOS build takes a lot of your time)

The solution on the internet was mostly to change the display name but I already did that. then what was the problem.

The problem was the build target name. The app is getting created in that very same name and apple does not allow this at all. So I simply double-clicked on the build target name and renamed that to our project name.

Build Number

When archiving your project all your packages will get listed on the Organizer (window->organizer). If you try to build with the same build number listed up here. You will receive an error after build only so you would be wasting your development time. To avoid just increase the build number.

File missing or File not found

I used react-native-asset to link fonts and images to ios and android projects. But the issue was my fellow developer removed few files and only fixed the issue in Android build. But when I tried to take ios to build the error logs stated files are missing.

So the problem was in Xcode project files the file references need to remove or the project file had to recreated based on a new project.

React Native Asset

when using the above package I missed removing link-assets-manifest.json files in ios and android project. After that re-running react-native-asset fixed my problem of linking updated asset info.

Launch Screen IOS

In Xcode goto, open your project and select LaunchScreen.xib file to see the preview of the existing splash screen. I just removed the texts (powered by React Native) and changed the background color to our project tone.

App Icon IOS

We had to change the icon for ios builds. Like in android, you need multiple images.

In Xcode goto, select Images.xsassets and for the different variant icons use some online converted your one high-quality image into multiple resolution images. If the image says 20*20 and 2x then choose an image with 40*40 resolution.

Native modules

We had an issue in linking native modules. As we add dependencies one by one in PodFile present in ios folder the error kept on coming for next dependency.

The problem was we accidentally removed use_native_modules! this line. which will automatically link modules.

use_native_modules!

React Native Camera

If you are using react-native-camera you will need to add below lines before the above piece of code.

permissions_path = '../node_modules/react-native-permissions/ios'
pod 'Permission-Camera', :path => "#{permissions_path}/Camera.podspec"

This will resolve RNPermission, not resolved.

I will try to update this article as I remember the issues I faced as i remember it. But if you are facing any issues with your React native project comment it down i will add those info as well.

--

--