How to change display name of an app in react-native

Apple have clear instructions on how to change the display name of an IOS app, but they are not useful for a react-native app because the folder structure is different. How do you change the display name if you have a react-native app?

Solution 1:

iOS

Goto ios/<Appname>/Info.plist and edit the $(PRODUCT_NAME) to change the display name

<key>CFBundleName</key>
<string>$(PRODUCT_NAME)</string>

Android

Goto android/app/src/main/res/values/strings.xml and edit the APP_NAME to change the name

<string name="app_name">APP_NAME</string>

Solution 2:

for ios just add this to Info.plist

<key>CFBundleDisplayName</key>
<string>APP_NAME</string>

for android edit strings.xml file which located in res/values/

<string name="app_name">APP_NAME</string>

Solution 3:

res -> values -> strings.xml

<string name="app_name">YOUR APP NAME HERE</string>

Change that and you will have changed your display name of the app.

Inside the manifest file, inside the application tag you will find

android:label="@string/app_name"

You can change this too, if you want to change the display name of your app.

Note: It is always recommended to have values stored in the "values" folder instead of hardcoding the values directly.

Solution 4:

There's a file called app.json in the root of your project. Just change the "displayName" then delete ios folder and run "react-native eject".

Solution 5:

file path : /android/app/src/main/res/values/strings.xml

replace My App with your app name.