It's simple issue but I don't know how to do it. I'm looking for some references, but there are problems.
I'm using react-native : 0.60.5. Hence there is no eject method or command.
The project was not created with expo.
After I referenced How to Rename A React Native App and error Unrecognized command "eject", then I follow the process below.
change the app.json's name and diplayName field to name which I want to change
remove android/ and ios/ directory
use react-native upgrade --legacy true
But there is no change on the project name and app name.
Is there any way to change the project and app name? Thanks.
Please check the below steps :
if you want to change both the app name and the package name (i.e. rename the entire app), the following steps are necessary:
Make sure you don't have anything precious (non-generated, manually
copied resources) in the android/ and ios/ subfolders.
Delete both the android/ and ios/ folder.
Change the "name" entry in your package.json to the new name.
Change the app name in both your index.android.js and index.ios.js:
AppRegistry.registerComponent('NewAppName', () => App);
Run react-native upgrade to re-generate the platform subfolders.
If you have linked resources (like custom fonts etc.) run
react-native link.
If you have other generated resources (like app icons) run the
scripts to generate them (e.g. yo).
Finally, uninstall the old app on each device and run the new one.
Hope it helps. feel free for doubts
for android edit strings.xml file which located in res/values/
string name="app_name">APP_NAME</string
I had a very hard time with this and this is what I did - hopefully it helps someone. Literally took me 15 minutes
https://www.npmjs.com/package/react-native-rename install react-native-rename and rename your app to whatever you need using the instructions provided for the package
Important part would be to use this:
npx react-native-rename "YourProjectName" -b com.yourporjectnamehere - because this is needed for android to work correctly
find in your project every file and folder name that will contain your previous name - for me it was mostly in ios folder. I had to rename all the folders and some of the files inside. just replace the part with your previous name with your current name
find all occurrences of your previous name left inside the project with the whole project search in your editor and replace them with the new name.
To make it work for ios
Delete Pods inside the ios folder
Delete node_modules
go to ios folder with your terminal and do pod install
do npm install in your original directory again
make sure all the caches are deleted for your ios simulator with yarn start --reset-cache
To make it work for android
Make sure that under android/app/src/com/yourprojectnamehere/ the folder contains MainApplication.java and MainActivity.java files and that the project name inside are updated
./gradlew clean inside android folder in terminal
Delete node_modules
npm install
react-native run-android and everything should be working
I know its a lot of steps, but from what I have found renaming react native app is not actually as easy as you might have thought
I'd like for my Create React App to generate a file called VERSION.txt that will end up in my deployed site's public directory as part of its build.
I know I can just create a static file in my repo's public/VERSION.txt, but I want its contents to come from an environment variable. The ENV variable is REACT_APP_COMMIT_REF, which is coming from my Netlify setup. I'd like my CRA to put this variable in public/VERSION.txt (so my React app can easily check it to see if a new version exists), but the docs on environment variables says they're only available in index.html (as well as in any source JS code via process.env).
As a workaround for now I've put it in a meta tag in my public/index.html
<meta name="app-version" content="%REACT_APP_COMMIT_REF%" />
but my app code now has to parse this string and I'd rather just have a public/VERSION.txt to achieve this.
Is it possible for CRA to programmatically generate files at build-time?
When I copy a project, I give the project folder a new name particularly if I want maintain the old version and create a new version with additional features. The problem with this is the compiled project takes the name from the folder name of the project which is a pain. For example if the initial is folder is myproject and I create a new folder myprojectwithfeatures, the file once installed becomes myprojectwithfeatures and not myproject. In sidekick, the project name/App name cannot be changed it is greyed out.
Is it possible to change the App Name to maintain the name across versions.
When I copy a project, I use the tns create command thusly:
tns create mynewapp --appid domain.mynewapp --template <path to>/myoldapp/app
This seems to work well.
I personally don't use SideKick but you can always update the project name to anything by modifying CFBundleDisplayName entry in App_Resources/iOS/info.plist and android:label="YourAppName" attribute of application tag in App_Resources/Android/src/main/AndroidManifest.xml
More details can be found here.
Let's say I initialize a project under react-native init <filename>, installed a bunch of node packages, and added code.
Then separately I initialize a different project under react-viro init <filename>, installed a bunch of node packages, and added code.
If I wanted to combine what I created under react-native init into what I created under react-viro init, is it as simple as copying files over and reinstalling missing node packages into the react-viro project?
Assuming you are working in the ./src folder, every file is independent of iOS or Android as part of the JavaScript bundle.
You can simply copy the .js files over and install the node packages in that project.
You probably should not copy any files that are outside the ./src folder, but I also suspect you wouldn't need to. Files in the Android and iOS folders are rarely touched as they contain operating system config settings and custom modules that you would have wrote in the native languages.
If the file renders JSX, you will be safe to just copy it over and hook it back up.
To state it another way, go into the folder that has node_modules in it. You shouldn't copy anything that is in that folder except additional files that you created. This is where people normally create an src folder and place all their JavaScript. You probably have an index file in there that points to ./src/app.js or you may have an index.ios.js and index.android.js that both point to a ./src/app.js. Anything inside src is safe.
That's my best answer without seeing your folders and files.
If you intend to copy code from one react native project to another, make sure the code you intend to copy is JS and not any native files. Make sure you do register the correct component using AppRegistry. Rest assured you can copy the code from one project to another.
Assuming you have a project at folder
/my-project/android
/my-project/ios
/my-project/src
Copy my-project and paste it at your desired folder like
/new-my-project
Change git origin
git remote set-url origin https://gitlab.com/..../**.git
Open /new-my-project/android in Android Studio, and then rename app/java/com.myproject to com.newmyproject
Go to app/build.grade and change com.myproject to com.newmyproject and sync
Create firebase project and download google-services.json file and add to new-my-project/android/app
Build application, then test application under metro bundler
npx react-native start
Create keystore, test notifications, change base_url_api, test apk etc Android finish now, iOS
Update pods on new-my-project/ios
pod install && pod update
open myproject.xcworkspace
Change bundle identifier to org.reactjs.native.newmyproject, version to 1.0, build to 1 and desired Display name. Let it index completely
Setup in firbase and replace GoogleService-Info.Plist file and Clean build folder in xcode
Go to developer.apple.com and create identifiers, APNS certificates, profiles
Download certificates from keychain and upload to firebase
Build the project in simulator/device and test it.
Done
I'm getting this error when trying to compile my React Native android app.
The Android app can't resolve BuildConfig.DEBUG.
:app:processDebugJavaRes UP-TO-DATE
:app:compileDebugJavaWithJavac
/Users/amirsharif/mobile-rappad/android/app/src/main/java/com/rappadmobile/MainActivity.java:29: error: cannot find symbol
.setUseDeveloperSupport(BuildConfig.DEBUG)
^
symbol: variable BuildConfig
location: class MainActivity
>1 error
:app:compileDebugJavaWithJavac FAILED
I can temporarily resolve it by simply setting it to true.
This might've happened after I changed an application name (since that's something I've also been trying to do).
I probably have to change something with Gradle so it generates the right kind of files again.
/**
* Automatically generated file. DO NOT MODIFY
*/
package com.app;
public final class BuildConfig {
public static final boolean DEBUG = Boolean.parseBoolean("true");
public static final String APPLICATION_ID = "com.rappadmobile";
public static final String BUILD_TYPE = "debug";
public static final String FLAVOR = "";
public static final int VERSION_CODE = 1;
public static final String VERSION_NAME = "1.0";
}
I had the same issue and it was resolved by simply adding following import statement in MainApplication.java:
import com.facebook.react.BuildConfig;
The way android knows where to find certain files, and how to connect certain files, is by using fields set in AndroidManifest.xml. Since the default setup of a React Native project, references everything with .(name-of-resource), this means that everything will be resolved with regarding to the package name set in the <manifest> tag. So for everything to work out of the box, and everything to be generated as expected, the path to MainActivity.java, should be the same as the package name.
example:
your apps package name:
com.mycompanyname.myappname
location of MainActivity.java: android/app/src/main/java/com/mycompanyname/myappname/MainActivity.java
I rebuilt the project with react-native upgrade.
My issue was then that I had old files that were referencing the old package names (because I changed the name of the app in package.json). Once deleting those, I resolved the issue.
In your MainActivity.java, you can check the first line is package com.YOU_APP_NAME;
If this line does not exist, you should add this.
A combination of some answers helped me, summary:
Make sure your java package names are correct (MainApplication.java etc.)
update the package name in the gradle build file
update the package name in the manifest file
update the package name in the BUCK file
make sure the path to you javascript sources is a folder structure that matches your package name
In my case, I changed the package name in both the BUCK file and Manifest file.
In the BUCK file, change as following.
android_build_config(
name = "build_config",
package = "NEW_PACKAGE_NAME",
)
android_resource(
name = "res",
package = "NEW_PACKAGE_NAME",
res = "src/main/res", )
If you renamed your bundle identifier you will likely need to change:
Your android/app/src/main/....../MainApplication.java package and imports.
Even though I used react-native-rename npm package, it did not take care of some files MainApplication.java and MainActivity.java.
Upgrading react-native solved this error -
react-native upgrade
Now build again -
react-native run-android
Delete the old files that might be there in android/app/src/main/java/com
Just keep the file with the new name of the app. Then do react-native upgrade.
My case was that I renamed the package in one place(AndroidManifest.xml)
Ex:
The original: com.example
Changed it to: com.example.app
Renaming it again solved the problem
I experienced this while following https://dev.to/karanpratapsingh/quick-guide-for-updating-package-name-in-react-native-3ei3. I was renaming my application from com.company_app to com.mycompany.myapp, apparently, there were some files that I still needed to update but was not included in the guide I was following, I think the guide is only for general, like a fresh react-native app, I solved this by doing a global search for com.company_app and just replacing each one to com.mycompany.myapp whenever it makes sense.
Seems like you have updated your package name in all files but failed to change the name of folder which we will same as your package name.
android < src < main < java < com < "middlen_package_name" <
"last_package_name".
ex: com.yourapp.gameapp;
Run the app again but if it still shows this error then ,
check if there is a folder with old package name. Delete this and rebuild again.
Happy Coding.
Check if you have missed installing the react-native-gesture-handler.
with yarn
yarn add react-native-gesture-handler
or with npm
npm install --save react-native-gesture-handler
Then
react-native link react-native-gesture-handler
I fixed it by following these steps:
Android Version:
From Terminal go to android folder and run this command:
gradlew clean
From main project folder delete this folder:
node_modules
From menu file:
Invalidate caches and restart IDE
Find your MainActivity.java file and add this import line:
import com.facebook.react.BuildConfig;
In terminal, go to android folder and run this:
gradlew
in terminal, go to main root and run this:
yarn install
Now you can start the metro and run the app.
P.S.: Make sure that into the MainActivity.java file the bundleID name is correct. You will find it into the first row. Then, make sure that the MainActivity.java file is located into the correct path like this:
project_name/Android/App/src/main/java/1/2/3/MainActivity.java where 1/2/3 must be the name of your bundleID, for example, com/bundle/id