Why red screen appears while lunching app first time? [duplicate] - android

I'm trying to run my first React Native project for first time on my device (Android 4.2.2).
And I get:
unable to load script from assets index.android.bundle
Commands that I used:
cd (project directory)
react-native start
react-native run-android

I've encountered the same issue while following the React Native tutorial (developing on Linux and targeting Android).
This issue helped me resolve the problem in following steps.
(in project directory) mkdir android/app/src/main/assets
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
react-native run-android
You can automate the above steps by placing them in scripts part of package.json like this:
"android-linux": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android"
Then you can just execute npm run android-linux from your command line every time.

If You are running your application on physical device and getting this error
unable to load script from assets index.android.bundle
try running the command:
adb reverse tcp:8081 tcp:8081
It workd for Me...

I spent hours trying to figure this issue out. My problem was not specific to Windows but is specific to Android.
Accessing the development server worked locally and in the emulator's browser. The only thing that did not work was accessing the development server in the app.
Starting with Android 9.0 (API level 28), cleartext support is disabled by default.
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest ...>
<uses-permission android:name="android.permission.INTERNET" />
<application
...
android:usesCleartextTraffic="true"
...>
...
</application>
</manifest>
See for more info:
https://stackoverflow.com/a/50834600/1713216

Using npm version 4.3.0 react-native-cli version 2.01 react-native version 0.49.5
In the project directory,
mkdir android/app/src/main/assets
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
react-native run-android
The file name has changed from index.android.js to index.js

I have faced the same problem with a real android device.
Solution: Based on this answer by Niltoid
Find your local IP
Open app and shake your Android device
Go Dev Setting and>Debug Server...
Paste your IP and port; X.X.X.X:8088" (where X's are your local IP)
for Mac user: open your network preference, here you will get your local IP.

If you are using Windows run the commands in the following way, or if you get an error "Cannot find entry file index.android.js"
mkdir android\app\src\main\assets
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
react-native run-android

Had the same issue in mac, After spending 2 days i was finally able to get is working.
Since Emulator cellular data was turned off, I was getting the unable to load script from assets index.android.bundle make sure your bundle is running.
Make sure your Emulator cellular data is turned on by doing this package server was able to bundle index.android.js. Hope it helps for someone who is in development phase.

You can follow the instruction mentioned on the official page to fix this issue. This issue occur on real device because the JS bundle is located on your development system and the app inside your real device is not aware of it's location.

I've had this same issue for a number of months now. I initially used #Jerry's solution however, this was a false resolution as it didn't fully fix the problem. Instead, what it did was take every build as a production build meaning that any slight change you made in the app would mean that rebuilding the entire app is necessary.
While this is a temporal solution, it works horribly in the long term as you are no longer able to avail of React Native's amazing development tools such as hot reloading etc.
A proper solution is a shown:
In your MainApplication.java file, replace the following:
#Override
public boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
with
#Override
public boolean getUseDeveloperSupport() {
return true;
}
as for some reason BuildConfig.DEBUG always returned false and resulted in a bundle file in the assets directory.
By manually setting this to true, you're forcing the app to use the packager. This WON't work in production so be sure to change it to false or the default value.
Don't forget also to run
$ adb reverse tcp:8081 tcp:8081

1 Go to your project directory and check if this folder exists android/app/src/main/assets
If it exists then delete two files viz index.android.bundle and index.android.bundle.meta
If the folder assets don't exist then create the assets directory there.
2.From your root project directory do
cd android && ./gradlew clean
3.Finally, navigate back to the root directory and check if there is one single entry file calledindex.js
If there is only one file i.e. index.js then run following command react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
If there are two files i.e index.android.js and index.ios.js then run this react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
Now run react-native run-android

In my case, I have removed below line from MainApplication.java. (Which is previously mistakenly added by me.):-
import com.facebook.react.BuildConfig;
After that Clean Project and hit command
react-native run-android

OS: Windows
Another way to resolve this problem after trying two methods above
(because I installed SDK not in DEFAULT LOCATION like C:\users\"user_name"\appdata\local\sdk)
If you noticed that command line announced: "'adb' is not recognized as an internal or external command..."
So this is how I get over:
Examples: I installed SDK in D:\Android\sdk
So I will insert path in System Variables 2 more lines:
D:\Android\sdk\tools
D:\Android\sdk\platform-tools
(If you don't know how to edit path System Variables, here's the topic: https://android.stackexchange.com/questions/38321/what-do-i-type-in-path-variable-for-adb-server-to-start-from-cmd/38324)
Then I run cmd again: react-native run-android
It worked for me.

I was also facing this problem because when I run projects on the emulator its working fine but on a real device it gives this error. So I resolve this problem by the following solution
1st step: First of all open cmd and go to your SDK manager Platform-tools folder
cd C:Development\Android\Sdk\Platform-tools
2nd step: now run this command :
adb devices
after this command check your device listed in command prompt
3rd step: now run this
adb reverse tcp:8081 tcp:8081
Now your setup is done
4th step: Go to your project directory and run this command
react-native run-android

For this problem I just solve it by running:
react-native start
then
adb reverse tcp:8081 tcp:8081
on command line. And then i can run:
react-native run-android
So i will not waste my time to run:
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
every time.

For IOS:
In a terminal:
cd ios
Remove the build folder with: rm -r build
Run again: react-native run-ios
Alternatively, you could open Finder, navigate to YOUR_PROJECT/ios and delete the build folder.
Then run again: react-native run-ios
For ANDROID:
In a terminal:
cd android/app
Remove the build folder with: rm -r build
Run again: react-native run-android
Alternatively, you could open Finder, navigate to YOUR_PROJECT/android/app and delete the build folder.
Then run again: react-native run-android

Ubuntu
first time, I created new app with react-native init project-name.
I got the same error.
so i do the following steps to resolve this in my case.
Firstly run sudo chown user-name-of-pc /dev/kvm in my case.
While debugging from your Android phone, select Use USB to Transfer photos (PTP).
Create Folder assets in project-name/android/app/src/main
make sure index.js be avaiable into your project root directory and then run below command from console after cd project-name directory.
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
or
for index.android.js then
react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
run command ./studio.sh in android-studio/bin directory. It will opens up Android Studio.
run command react-native run-android.

Make sure metro builder is running to make your physical device and server sync
First, run this command to run metro builder
npm start
Then you can start the build in react native
react-native run-android
Their should be no error this time. If you want your code to be live reload on change. Shake your device and then tap Enable Live Reload

Make sure that you have added /path/to/sdk/platform-tools to your path variable.
When you run react-native run-android, it runs adb reverse tcp:< device-port > tcp:< local-port > command to forward the request from your device to the server running locally on your computer.
You will see something like this if adb is not found.
/bin/sh: 1: adb: not found
Starting the app (.../platform-tools/adb shell am start -n
com.first_app/com.first_app.MainActivity...
Starting: Intent { cmp=com.first_app/.MainActivity }

I had issue with McAfee on my mac blocking port 8081, had to change it to 8082.
First run your package server:
react-native start --port 8082
Open another terminal, start the android app as usual:
react-native run-android
Once it finishes, now rewrite the tcp port that adb tunnels:
adb reverse tcp:8081 tcp:8082
See the list of adb tcp tunnels:
adb reverse --list
You should now see a heartwarming message:
(reverse) tcp:8081 tcp:8082
Go to your app and reload, done!
PS: Don't change anything in the app Dev settings, if you added "localhost:8082", just remove it, leave it blank.
EDIT:
To all the McAfee victims out there, there's easier solution if you have root access, just temporarily kill the McAfee process sitting on port 8081 and no need for port change at all:
sudo launchctl remove com.mcafee.agent.macmn

It may be caused by unlinked assets in your React Native project code base, like when you renames your project application/bundle id or adds an external package without link it properly, for example.
Simply try it in your project root directory:
react-native link
react-native run-android

This problem also happens if you define an android:networkSecurityConfig in your main AndroidManifest.xml. The android:usesCleartextTraffic="true" in your debug AndroidManifest.xml will be ignored.
To fix this issue, you have to configure the app to allow http traffic to localhost.
Create a file android/src/debug/res/xml/network_security_config.xml:
<?xml version="1.0" encoding="utf-8" ?>
<network-security-config>
<domain-config cleartextTrafficPermitted="true">
<domain includeSubdomains="true">localhost</domain>
</domain-config>
</network-security-config>
And reference it in android/src/debug/AndroidManifest.xml:
<?xml version="1.0" encoding="utf-8" ?>
<manifest
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />
<application
android:networkSecurityConfig="#xml/network_security_config"
tools:targetApi="28"
tools:ignore="GoogleAppIndexingWarning" />
</manifest>
Further infos here: https://medium.com/astrocoders/i-upgraded-to-android-p-and-my-react-native-wont-connect-to-my-computer-to-download-index-delta-42580377e1d3

If when running react-native run-android command the second line of the trace is
JS server not recognized, continuing with build...
it means packager for the app cannot be started and the app will fail to load without some extra steps. Note that the end of the trace still reports success:
BUILD SUCCESSFUL
The problem is probably some port conflict (in my case it was the default IIS site that I completely forgot about). Another manifestation of the problem would be a failure to open http://localhost:8081/debugger-ui URL in Chrome.
Once the port conflict is resolved the trace will report
Starting JS server...
then an additional Node window will open (node ...cli.js start) and the app will load/reload successfully.
After that you should be able to open debug console in Chrome with http://localhost:8081/debugger-ui.

I had the same issue even when running on a simulator. I did a quick workaround so that I could have the normal dev workflow.
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
#Override
public boolean getUseDeveloperSupport() {
// return true here to load JS from the packager
// BuildConfig.DEBUG for me was set to false which meant it
// it was always trying to load the assets from assets folder.
return true;
}
#Override
protected String getJSMainModuleName() {
return "index";
}
};
Probably will have to revert the change when trying to do a production build.

I think you don't have yarn installed try installing it with chocolatey or something. It should be installed before creating your project (react-native init command).
No need of creating assets directory.
Reply if it doesn't work.
Edit:
In the recent version of react-native they have fixed it. If you want complete freedom from this just uninstall node (For complete uninstallation Completely remove node refer this link) and reinstall node, react-native-cli then create your new project.

don't forget turn on internet in emulator device,
I resovled this error, it work perfect :V
I get this error because i turn off internet to test NetInfo :D

This is a general error message, you may have encountered during the react native application development. So In this tutorial we are going to provide solution to this issue.
Issue Description :
Unable to load script from assets index.android.bundle on windows
Unable to load script from assets index.android.bundle on windows
Follow the below steps to solve above issue :
Step-1 : Create "assets" folder inside your project directory
Now create assets folder inside the project directory that is "MobileApp\android\app\src\main". You can manually create assets folder :
< OR >
you can create folder by using command as well.
Command :
mkdir android/app/src/main/assets
Step-2 : Running your React Native application
Lets run the below command to run the react native application in emulator or physical device.
Switch to project directory.
cd MobileApp
Run the below command that helps to bundle you android application project.
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
Run the Final step to run react native application in emulator or physical device.
react-native run-android
< OR >
Also you can combine last two command in one, In this case case you have to execute command only once.
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android
< OR >
You can automate the above steps by placing them in scripts part of package.json like this:
"android-android": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android"
If everything is set up correctly, you should see your new app running in your Android emulator shortly.

I have just encounterred exactly the same problem and solved it. So hope to be helpful.
Suppose you are assemblling a release application package (.apk)
Check if your assets folder exist?: \android\app\src\main\assets
If not, create one.
After executing "Assemble Release", check if there is anything in that folder(\android\app\src\main\assets)
If not, find js bundle file(index.android.bundle), which should be in more than one of the following paths:
*a)\android\app\build\intermediates\merged_assets\release\out\index.android.bundle
b)\android\app\build\intermediates\merged_assets\release\mergeReleaseAssets\out\index.android.bundle
c)\android\app\build\intermediates\assets\release\index.android.bundle
d)\android\app\build\generated\assets\react\release\index.android.bundle*
A better way is to use "Everything" to search the file name: index.android.bundle.
Then copy this file into your assets folder(\android\app\src\main\assets\index.android.bundle)
Go back to powershell or command console, execute:
react-native run-android --variant=release
It should work.
Good luck!

Actually, in my situation (React-native version 0.61.5 and trying to install debug APK on device) none of the answers helped me, my solution was adding bundleInDebug: true to android/app/build.gradle like this:
project.ext.react = [
entryFile: "index.js",
enableHermes: true, // clean and rebuild if changing
bundleInDebug: true
]

I have spent half a day figuring this issue...
If you are using the API target version Above 28.0.0 then you may face this issue.
Just add this line
android:usesCleartextTraffic="true"
in your Manifest Application block.
Manifest Application block code.
<application
....
android:usesCleartextTraffic="true"
.../>

when I update react-native to 0.49.5, this problem appears and when I followed this Breaking changes and deprecations
it disappeared.

Related

react-native hellow world app - working in emulator but not in physical device

I'm new to React-native and i create my first hello world program. In android studio emulator it works fine.
Emulator shows
I used following commands
react-native start
react-native run-android
But when i get the app-debug.apk file from output folder and install in my physical mobile phone it gives following error. (This is a screenshot)
Have i done wrong somewhere?
Thank you
https://facebook.github.io/react-native/docs/running-on-device
follow these steps, don't copy an apk file.
Add this line in package.json
script:{
--
"android-dev": "adb reverse tcp:8081 tcp:8081 && react-native run-android"
}
and run this command :
adb reverse tcp:8081 tcp:8081
react-native run-android
i suggest to use this steps to run your apk from this answer
These steps really help me:
Step 1: Create a directory in android/app/src/main/assets
Linux command: mkdir android/app/src/main/assets
Step 2: Rename index.android.js (in root directory) to index.js (Maybe there is an index.js file in which case you do not need to rename it) then run the following command:
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
Step 3: Build your APK: react-native run-android

Not able to bundle application using react-native start

I was getting one error :
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
So I have fired this command :
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
So that error gone, but Now problem is I am not able to debugging. If I am using react-native start command then also in not bundling.
So main problem is I am not able to bundle application.
Please guide on this point.
Thanks.
I am getting this error.
Points :
You can still debug on logcat in android studio or Xcode.
run react-native run-android in one terminal and react-native start in another terminal
Please check whether the port is 8081 if not then change it in the dev setting in adb by adding your local pc ip.
Delete node modules and try updating your metro bundle. Then install them. Hope this will work!
Sometimes the metro bundle hangs, its common.

Unable to load script from assets 'index.android.bundle',Make sure your bundle is packaged

I have made sure that bundler and emulator are running.
If I use this commend
react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
It might work but refresh won't happen when I press rr in emulator.
I have also tried reversal of abd adb reverse tcp:8081 tcp:8081.
Nothing works for me.
click here to see the error screen.
To resolve Unable to load script from assets index.android.bundle - React Native follow below process :
You have to create dir assets manually in your android project or make Directory by Terminal/CMD enter mkdir android/app/src/main/assets
Go at the created Directory if that is successfully created then
run step 3 Command:
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
you have your missed files in the folder now you can Run your React Native project npm run android.
Sometimes you have to clear the cache to load your assets properly.
Use the command react-native start --reset-cache
and re-run react-native run-android
I had this issue after having had it work for the past couple days. I realized that I had manually configured a proxy. As soon as I turned that off, it worked.
For me, Gradle clean fixed it when I was having an issue on Android
cd android
./gradlew clean

Unable to load script from assets 'index.android.bundle'. Make sure your bundle is packaged correctly or you're running a packager server

I am having working React Native application having version 0.38.0, when i have tried to upgrade it to 0.45.1 it is showing following error
java.lang.RuntimeException: Unable to load script from assets 'index.android.bundle'. Make sure your bundle is packaged correctly or you're running a packager server.
at com.facebook.react.cxxbridge.CatalystInstanceImpl.jniLoadScriptFromAssets(Native Method)
at com.facebook.react.cxxbridge.CatalystInstanceImpl.loadScriptFromAssets(CatalystInstanceImpl.java:198)
at com.facebook.react.cxxbridge.JSBundleLoader$1.loadScript(JSBundleLoader.java:33)
at com.facebook.react.cxxbridge.CatalystInstanceImpl.runJSBundle(CatalystInstanceImpl.java:216)
at com.facebook.react.ReactInstanceManager.createReactContext(ReactInstanceManager.java:994)
at com.facebook.react.ReactInstanceManager.access$600(ReactInstanceManager.java:109)
at com.facebook.react.ReactInstanceManager$4.run(ReactInstanceManager.java:746)
at java.lang.Thread.run(Thread.java:761)
I have tried following solutions but it didn't work for me
SO: unable to load script from assets index.android.bundle on windows
SO: react native android failed to load JS bundle
1- Create a new folder => android/app/src/main/assets
2- Run this command =>
react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
This command will create 2 files : index.android.bundle & index.android.bundle.meta
3- run command => react-native run-android
Add these lines
project.ext.react = [
entryFile: "index.js",
bundleAssetName: "index.android.bundle",
bundleInAlpha: true,
bundleInBeta: true
]
before
apply from: "../../node_modules/react-native/react.gradle" in build.gradle
Okay. Every answers are unique depending on 'when' and 'the version' at the time the problem occur.
Today is 27 August 2018 ( 1.2 years from this page posted) and I still
found the same problem when I install react-native and create projects
(on windows) by following the official website instruction.
And honestly it is very difficult to find the right answer to make it work like 'normal' for 'today', because everything has changed and is different from the time that has been left behind.
Now for the above question : Unable to load script from assets
'index.android.bundle'.
Meaning that we don't have the file as requested in the directory assets. That's all the problem!. There is no relation to port, devices, emulator etc.
Now what we need to do is to make the file is 'exist there'. And these are some options to you can do depending on your package configuration :
Create the directory 'assets' if not exist as requested in directory
android/app/src/main/ or you can type in the console : mkdir
android/app/src/main/assets
In your project directory, execute :
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
Then check in the asset folder if the files is already there. If not,
then try the second way :
1 react-native start // open npm window popup
2 curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"
Then check in the asset folder if the files is already there. If not,
then you need to down grade your project to earlier version packages.
Follow these 5 steps and must complete one by one :
1 npm remove --save react-native
2 npm i --save react-native#0.55.4
3 npm remove babel-preset-react-native
4 npm i --save babel-preset-react-native#2.1.0
5 react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
If you already have the files in asset folder, then you can continue your project.
Check if your device is connected and ready, and run-android :
adb devices
Make sure you get result like this :
List of devices attached
cb8eca15 device
Then run :
react-native run-android
Note : Alternatively, you can create a new project again with a specified version :
react-native init ProjectName --version 0.55.4
To resolve Unable to load script from assets index.android.bundle - React Native follow below process :
You have to create dir assets manually in your android project or make Directory by Terminal/CMD enter mkdir android/app/src/main/assets
Go at the created Directory if that is successfully created then
run step 3 Command:
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
you have your missed files in the folder now you can Run your React Native project npm run android.
https://stackoverflow.com/a/53275340/9489285
In my case, the emulator was on airplane mode.
Make sure your emulator or mobile phone can communicate with the Metro server.

unable to load script from assets 'index.android.bundle'

I'm new in react-native.
I have run react native project on Ubuntu by using 'react-native run-android' command. And I got the error on emulator
"Unable to load script from assets 'index.android.bundle'.Make sure your bundle is packaged correctly or you are running a package server."
I also got this and I resolved this using following commands in your project directory:
$ mkdir android/app/src/main/assets
$ react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
$ react-native run-android
Using
npm version 4.3.0
react-native-cli version 2.01
react-native version 0.49.5
In project directory,
mkdir android/app/src/main/assets
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
react-native run-android
The file name has changed from index.android.js to index.js
In my case (embedding React Native as a new Activity into an existing Android Code Base), the problem was Android Studio had auto-imported the wrong BuildConfig.
Wrong:
import com.facebook.react.BuildConfig;
Right:
import com.mywebdomain.myapp.BuildConfig;
This would apply to the wherever you are housing this block of code:
mReactRootView = new ReactRootView(this);
mReactInstanceManager = ReactInstanceManager.builder()
.setApplication(getApplication())
.setBundleAssetName("index.android.bundle")
.setJSMainModulePath("index")
.addPackage(new MainReactPackage())
.setUseDeveloperSupport(BuildConfig.DEBUG)
.setInitialLifecycleState(LifecycleState.RESUMED)
.build();
For this error :
unable to load script from assets 'index.android.bundle'
1) Check for "assets" folder at :
mkdir android\app\src\main\assets
If the folder is not available, create a folder with name "assets" manually. and execute the Curl command in terminal.
2). Curl command:
curl "http://localhost:8081/index.android.bundle?platform=android" -o"android/app/src/main/assets/index.android.bundle"
It will create the "index.android.bundle" file in assets folder automatically and resolved the issue.
3) Then:
react-native run-android
This helped me resolve the problem in following steps.
If not than (in project directory) mkdir android/app/src/main/assets
react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
react-native run-android
Ubuntu
first time, I created new app with react-native init project-name. I got the same error. so i do the following steps to resolve this in my case.
Firstly run sudo chown user-name-of-pc /dev/kvm in my case.
While debugging from your Android phone, select Use USB to Transfer photos (PTP).
Create Folder assets in 'project-name/android/app/src/main'.
make sure index.js be avaiable into your project root directory and then run below command from console after cd project-name directory.
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
or for index.android.js then
react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
run command ./studio.sh in android-studio/bin directory. It will opens up Android Studio.
run command react-native run-android.
It seems to be a problem in the newest version of React Native (0.46). Using the previous version seems to solve the problem react-native init name --version react-native#0.45.1 and removes the error when running react-native run-android.
Edit: It is now fixed in version 0.46.1.
In my case the problem was in this row in the React Activity file:
mReactInstanceManager = ReactInstanceManager.builder()
...
.setUseDeveloperSupport(BuildConfig.DEBUG)
...
BuildConfig.DEBUG must be set to true, while in my case it was false
For Windows user only:
Copy the path of adb location and set into PATH in your system variable,
Open project structure and delete node module folder.
Edit your project package.JSON file
change react-native version "react-native": "0.55.2", and
babel "babel-preset-react-native": "4", after that run npm install
Restart cmd and js server and run your react native project by react-native run-android
I was stuck in the same problem for hours and what solved my issue is this :
Create "assets" folder in main directory of project as well as in "newreactproject\android\app\src\main". Then put this script in package.json "android-android": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android"
like:
"name": "newreactproject",
"version": "0.0.1",
"private": true,
"scripts": {
"android-android": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android",
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
}
I discovered a solution suggested in the thread at https://github.com/facebook/react-native/issues/15388
It is to manually set the Debug server host & port for device setting for the app on the phone.
Step by Step to eject and run a CRNA on Android
In terminal:
create-react-native-app myApp
cd myApp
yarn run eject (I used default options "regular React Native project")
react-native run-android
(now the app should be compiled and installed on the phone)
On phone:
Run the app (expect to see the red error screen! - click Dismiss button in bottom left)
Shake the phone and pick Dev Settings
Pick Debug server host & port for device and set to 192.168.x.x:8081 (make it your actual LAN IP of course)
Restart app on phone and you should see green bar at the top "Loading from 192.168.x.x:8081..."
You should also see some "Bundling index.js" action in the Metro Bundler (that opened when running react-native run-android)
After the bundle is finished, the app should be running on your Android device!
Live Reload (when source files change) also works - just shake the phone and touch "Enable Live Reload"
You can run the project from Android Studio, but you need to first start the Metro Bundler with the command react-native start in the CRNA project root.
I was getting this error too. But adb reverseworked for me
i'm using ubuntu 18.04 LTS ,react-native: 0.55.2. In my case here are few solutions for the problem .
in the terminal before you run npm run android type npm start. you might see an error
ERROR Metro Bundler can't listen on port 8081.
this occurs because there might be a process which is already running
Solution- type sudo lsof -i :8081
you will see an output similar to this
**COMMAND PID USER FD TYPE DEVICE SIZE/OFF NODE NAME
node 5670 tasif 17u IPv6 80997 0t0 TCP *:tproxy (LISTEN)**
type kill -9 (PID number)then run npm android.
if it still doesnt work type again npm start . you might see this error
ERROR ENOSPC: no space left on device, watch'....../......./.....'
solution :
$ sudo sysctl fs.inotify.max_user_watches=524288
$ sudo sysctl -p
then type npm run android.
please go to this link to see different solutions and more details https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers#the-technical-details
delete the emulator and build it again. kill the recent terminal and then build emulator and start again.

Categories

Resources