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

Question

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?

Answer 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>

Answer 2

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".

Answer 3

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>

Answer 4

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.