[android] Change package name for Android in React Native

I used react-native init MyApp to initialise a new React Native app. This created among others an Android project with the package com.myapp.

What's the best way to change this package name, for example to: com.mycompany.myapp?

I tried changing it in AndroidManifest.xml but it created other errors, so I'm assuming it's not the way.

Any idea?

This question is related to android react-native react-native-android

The answer is


Follow the simple steps to rename your app name and Package name in case you have not made any custom changes in android folder(ie. scenario where u just initialized the project)

  1. Simply change the name in the package.json file as you need and save it.
  2. Remove the folder named android
  3. run the command react-native upgrade

Note:As ivoteje50 mentioned in comment,Don't remove the android folder if you have already followed the official instructions to generate a keystore, since it will remove the keystore and you cannot sign a new app again.


Goto Android studio

Right click your package (most probably com)-> Refractor -> Rename -> Enter new package name in the dialog -> Do Refractor

It will rename your package name everywhere.


To change the package name from com.myapp to: com.mycompany.myapp (for example),

  1. For iOS app of the react app, use xcode - under general.
  2. For the android app, open the build.gradle at module level. The one in the android/app folder. You will find
// ...
defaultConfig {
     applicationId com.myapp
     // ...
}
// ...

Change the com.myapp to whatever you need.

Hope this helps.


The init script generates a unique identifier for Android based on the name you gave it (e.g. com.acmeapp for AcmeApp).

You can see what name was generated by looking for the applicationId key in android/app/build.gradle.

If you need to change that unique identifier, do it now as described below:

In the /android folder, replace all occurrences of com.acmeapp by com.acme.app

Then change the directory structure with the following commands:

mkdir android/app/src/main/java/com/acme

mv android/app/src/main/java/com/acmeapp android/app/src/main/java/com/acme/app

You need a folder level for each dot in the app identifier.

Source: https://blog.elao.com/en/dev/from-react-native-init-to-app-stores-real-quick/


You can use react-native-rename package which will take of all the necessary changes of package name under

app/mainapplication.java

AndroidManifest.xml

but make sure to manually change the package name of all files under the java/com folder. because when i created an splash screen activity the old package name is not updated.

https://www.npmjs.com/package/react-native-rename


In VS Code, press Ctrl + Shift + F and enter your old package name in 'Find' and enter your new package in 'Replace'. Then press 'Replace all occurrences'.

Definitely not the pragmatic way. But, it's done the trick for me.


you can simply use react-native-rename npm package.

Install using

npm install react-native-rename -g

Then from the root of your React Native project execute the following

react-native-rename "MyApp" -b com.mycompany.myapp

react-native-rename on npm

but notice that, this lib remove your MainActivity.java and MainApplication.java. before changing your package name, give a backup from this two file and, after changing package name just put it back to their place. this solution work for me

more info: react-native-rename


Use npx react-native-rename <newName>

With custom Bundle Identifier (Android only. For iOS, please use Xcode)

$ npx react-native-rename <newName> -b <bundleIdentifier>

First, Switch to new branch (optional but recommended)

$ git checkout -b rename-app

Then, Rename your app $ npx react-native-rename "Travel App"

With custom Bundle Identifier

$ npx react-native-rename "Travel App" -b com.junedomingo.travelapp 

After you change the name, please make sure you go to the android folder and run gradlew clean. then go back to the main project and run npx react-native run-android.

Also If you have google-services.json file in your previous project, change accordingly with the new one ... then you are good to go :)

See More here https://github.com/junedomingo/react-native-rename#readme


Before changing your react native package name! please make a backup of MainActivity.java and MainApplication.java file. Because this lib remove your MainActivity.java and MainApplication.java.

after doing this you can simply use react-native-rename npm package.

Install

npm install react-native-rename -g

Then from the root of your React Native project execute the following

react-native-rename "new_project_name" -b com.mycompany.newprojectname

finally you can check it out your new package name in your AndroidManifest.xml. Don't forgot to rename the package name in your MainActivity.java and MainApplication.java .

Thank you.


I use the react-native-rename* npm package. Install it via

npm install react-native-rename -g

Then, from the root of your React Native project, execute the following:

react-native-rename "MyApp" -b com.mycompany.myapp

very simple way :

cd /your/project/dir

run this command :

grep -rl "com.your.app" . | xargs sed -i 's/com.your.app/com.yournew.newapp/g'

rename your folder

android/app/src/main/java/com/your/app

change to

android/app/src/main/java/com/yournew/newapp

Go to Android Studio, open app, right click on java and choose New and then Package.

Give the name you want (e.g. com.something).

Move the files from the other package (you want to rename) to the new Package. Delete the old package.

Go to your project in your editor and use the shortcut for searching in all the files (on mac is shift cmd F). Type in the name of your old package. Change all the references to the new package name.

Go to Android Studio, Build, Clean Project, Rebuild Project.

Done!

Happy coding :)


The simplest one:

npx react-native-rename YourNewAppName -b com.YourCompanyName.YourNewAppName


Go to file android/app/src/main/AndroidManifest.xml -

Update :

attr android:label of Element application as :

Old value - android:label="@string/app_name"

New Value - android:label="(string you want to put)"

and

attr android:label of Element activity as :

Old value - android:label="@string/app_name"

New Value - android:label="(string you want to put)"

Worked for me, hopefully it will help.


If you are using Android Studio-

changing com.myapp to com.mycompany.myapp

  1. create a new package hierarchy com.mycompany.myapp under android/app/src/main/java

  2. Copy all classes from com.myapp to com.mycompany.myapp using Android studio GUI

  3. Android studio will take care of putting suitable package name for all copied classes. This is useful if you have some custom modules and don't want to manually replace in all the .java files.

  4. Update android/app/src/main/AndroidManifest.xml and android/app/build.gradle (replace com.myapp to com.mycompany.myapp

  5. Sync the project (gradle build)


To change package I have searched and tried many methods but some are very hard and some are outdated. While searching I found a website that discuss a very simple method that are tested and personally i have also used this. Link : https://www.geoclassifieds.in/2021/02/change-package-name-react-native.html


If you are using VSCode and Windows.

1.Press Control + Shift + F.

2.Find Your Package Name and Replace All with your new Package Name.

  1. type "cd android"

  2. type "./gradlew clean"


I've used the react-native-rename package.

In terminal run the command to install:

npm install react-native-rename -g

In the root of your React Native project, run the following command:

react-native-rename "NewNameOfApp" -b com.companyname.newnameofapp

After running this:

react-native-rename "MyApp" -b com.mycompany.myapp

Make sure to also goto Build.gradle under android/app/... and rename the application Id as shown below:

defaultConfig {
        applicationId:com.appname.xxx
........
}

I have a solution based on @Cherniv's answer (works on macOS for me). Two differences: I have a Main2Activity.java in the java folder that I do the same thing to, and I don't bother calling ./gradlew clean since it seems like the react-native packager does that automatically anyways.

Anyways, my solution does what Cherniv's does, except I made a bash shell script for it since I'm building multiple apps using one set of code and want to be able to easily change the package name whenever I run my npm scripts.

Here is the bash script I used. You'll need to modify the packageName you want to use, and add anything else you want to it... but here are the basics. You can create a .sh file, give permission, and then run it from the same folder you run react-native from:

rm -rf ./android/app/src/main/java


mkdir -p ./android/app/src/main/java/com/MyWebsite/MyAppName
    packageName="com.MyWebsite.MyAppName"
    sed -i '' -e "s/.*package.*/package "$packageName";/" ./android/app/src/main/javaFiles/Main2Activity.java
    sed -i '' -e "s/.*package.*/package "$packageName";/" ./android/app/src/main/javaFiles/MainActivity.java
    sed -i '' -e "s/.*package.*/package "$packageName";/" ./android/app/src/main/javaFiles/MainApplication.java
    sed -i '' -e "s/.*package=\".*/    package=\""$packageName"\"/" ./android/app/src/main/AndroidManifest.xml
    sed -i '' -e "s/.*package = '.*/  package = '"$packageName"',/" ./android/app/BUCK
    sed -i '' -e "s/.*applicationId.*/    applicationId \""$packageName"\"/" ./android/app/build.gradle

    cp -R ./android/app/src/main/javaFiles/ ./android/app/src/main/java/com/MyWebsite/MyAppName

DISCLAIMER: You'll need to edit MainApplication.java's comment near the bottom of the java file first. It has the word 'package' in the comment. Because of how the script works, it takes any line with the word 'package' in it and replaces it. Because of this, this script may not be future proofed as there might be that same word used somewhere else.

Second Disclaimer: the first 3 sed commands edit the java files from a directory called javaFiles. I created this directory myself since I want to have one set of java files that are copied from there (as I might add new packages to it in the future). You will probably want to do the same thing. So copy all the files from the java folder (go through its subfolders to find the actual java files) and put them in a new folder called javaFiles.

Third Disclaimer: You'll need to edit the packageName variable to be in line with the paths at the top of the script and bottom (com.MyWebsite.MyAppName to com/MyWebsite/MyAppName)


Simply using the search and replace tool of my IDE did the trick.


Examples related to android

Under what circumstances can I call findViewById with an Options Menu / Action Bar item? How to implement a simple scenario the OO way My eclipse won't open, i download the bundle pack it keeps saying error log getting " (1) no such column: _id10 " error java doesn't run if structure inside of onclick listener Cannot retrieve string(s) from preferences (settings) strange error in my Animation Drawable how to put image in a bundle and pass it to another activity FragmentActivity to Fragment A failure occurred while executing com.android.build.gradle.internal.tasks

Examples related to react-native

How to resolve the error on 'react-native start' React Native Error: ENOSPC: System limit for number of file watchers reached How to update core-js to core-js@3 dependency? Unable to load script.Make sure you are either running a Metro server or that your bundle 'index.android.bundle' is packaged correctly for release error Failed to build iOS project. We ran "xcodebuild" command but it exited with error code 65 How can I force component to re-render with hooks in React? What is useState() in React? Getting all documents from one collection in Firestore ReactJS: Maximum update depth exceeded error React Native: JAVA_HOME is not set and no 'java' command could be found in your PATH

Examples related to react-native-android

How to resolve the error on 'react-native start' Unable to load script.Make sure you are either running a Metro server or that your bundle 'index.android.bundle' is packaged correctly for release React Native version mismatch Unable to load script from assets index.android.bundle on windows Run react-native on android emulator Change package name for Android in React Native