Source:  Twitter logo

react-native run-android command terminates by leaving a message in android simulator. The message is as follows:

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.

What am I doing wrong?

You haven't started the bundler yet. Run npm start or react-native start in the root directory of your project before react-native run-android.

159 users liked answer #0dislike answer #0159
Nerdragen profile pic
Nerdragen

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

Please use index.js in latest version.

Enjoy :)

108 users liked answer #1dislike answer #1108
Saeed profile pic
Saeed

For me this error was caused by an upgrade of react-native

Starting with Android 9.0 (API level 28), cleartext support is disabled by default.

If you check out the upgrade diff you need to create a debug manifest android/app/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:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
</manifest>

See for more info: https://stackoverflow.com/a/50834600/1713216

https://react-native-community.github.io/upgrade-helper/

49 users liked answer #2dislike answer #249
Tom profile pic
Tom

If you have everything correctly configured then try this:

adb reverse tcp:8081 tcp:8081

Why?

When the RN packager is running, there is an active web server accessible in your browser at 127.0.0.1:8081. It's from this server that the JS bundle for your application is served and refreshed as you make changes. Without the reverse proxy, your phone wouldn't be able to connect to that address.

All credits to Swingline0 .

49 users liked answer #3dislike answer #349
Tua Tara profile pic
Tua Tara

A similar issue happened with me.
Apparently Mcafee blocks 8081 port. Took me hours to figure this out.

Try running:

react-native run-android --port=1234

When app shows up with an error on emulator, get into dev settings (Ctrl+M).

Change the "Debug server host and port for device" to "localhost:1234".

Close the app and start it from the app drawer.

45 users liked answer #4dislike answer #445
Naveen Kumar profile pic
Naveen Kumar

You can try the following:

Add this line on your AndroidManifest.xml

<application
[...]
android:usesCleartextTraffic="true"
/>
[...]
</application>

EDIT: Be careful, it must be false on production for the security of your app

29 users liked answer #5dislike answer #529
tinmarfrutos profile pic
tinmarfrutos

just add three splash in : node_modules\metro-config\src\defaults\blacklist.js

replace this part:

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];
20 users liked answer #6dislike answer #620
Alireza profile pic
Alireza

First do steps 4 and 5 then you can run your project. If you do not get the result (with steps 4 and 5) do the following steps

1- Try to downgrade your Node version (current version is 12.13.1)

  choco uninstall nodejs
  choco install nodejs --version 12.8

2- Add the path of npm module (C:\Users\your user name\AppData\Roaming\npm) to system variables instead of user variables

3- Install react native globally by using command

  npm install -g react-native-cli

4- Go to the root of your project directory and run the following command :

  react-native start

5- Open another terminal in the root of your project and run the following command :

   react-native run-android 

EDIT :

You are using Genymotion ? If yes, do the following step :

After above step if you get the following error ?

error Failed to launch emulator. Reason: No emulators found as an output of `emulator -list-avds`.

Open your genymotion and go to :

genymotion menu -> Settings -> ADB -> Then select use custom android sdk tools (click on browse to find sdk location)

Finally , run you project again ..

17 users liked answer #7dislike answer #717
AbolfazlR profile pic
AbolfazlR

[Quick Answer]

After try to solve this problem in my workspace I found a solution.

This error is because there are a problem with Metro using some combinations of NPM and Node version.

You have 2 alternatives:

  • Alternative 1: Try to update or downgrade npm and node version.
  • Alternative 2: Go to this file: \node_modules\metro-config\src\defaults\blacklist.js and change this code:

    var sharedBlacklist = [
      /node_modules[/\\]react[/\\]dist[/\\].*/,
      /website\/node_modules\/.*/,
      /heapCapture\/bundle\.js/,
      /.*\/__tests__\/.*/
    ];
    

    and change to this:

    var sharedBlacklist = [
      /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
      /website\/node_modules\/.*/,
      /heapCapture\/bundle\.js/,
      /.*\/__tests__\/.*/
    ];
    

    Please note that if you run an npm install or a yarn install you need to change the code again.

11 users liked answer #8dislike answer #811
Javier C. profile pic
Javier C.

This worked for me after trying several ways.

In the file node_modules\metro-config\src\defaults\blacklist.js

Replace :

var sharedBlacklist = [
  /node_modules[/\\]react[/\\]dist[/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

with :

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

hope this helps.

9 users liked answer #9dislike answer #99
Mangalprada Malaya profile pic
Mangalprada Malaya

In my case, the emulator's Wifi and Mobile Data was off.

9 users liked answer #10dislike answer #109
chandan profile pic
chandan

Starting with Android 9.0 (API level 28), cleartext support is disabled by default.

This is what you need to do to get rid of this problem if you do normal run commands properly

  1. npm install
  2. react-native start
  3. react-native run-android

And modify your android manifest file like this.

<application
    android:name=".MainApplication"
    android:icon="@mipmap/ic_launcher"
    android:usesCleartextTraffic="true" // add this line with TRUE Value.
android:theme="@style/AppTheme">
8 users liked answer #11dislike answer #118
MD. Shafiul Alam Biplob profile pic
MD. Shafiul Alam Biplob

If you are on linux open the terminal from the App root directory and run

npm start

then open another terminal window and run:

react-native run-android
7 users liked answer #12dislike answer #127
solomon njobvu profile pic
solomon njobvu

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. Run following commands in the below sequence:

  1. (in project directory) mkdir android/app/src/main/assets
  2. 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
  3. 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.

7 users liked answer #13dislike answer #137
cracknut profile pic
cracknut

Like most of us I assume you are running on VSCODE. In my case, I ran

npx react-native start

from a seperate terminal

Now run npx react-native run-android from your terminal in VSCODE

6 users liked answer #14dislike answer #146
ambassallo profile pic
ambassallo

My solution to this is as below:

Start Metro server

$ react-native start

Start Android

$ react-native run-android

If see errors saying "port 8081 already in use", then you can kill that process and rerun

$ react-native start

See React Native Troubleshooting Page .

5 users liked answer #15dislike answer #155
shizhen profile pic
shizhen

After hours searching for a answer. The solution was to make a downgrade node to version 12.4.

In my case I realize that the error just occurs in version react native 0.60 with node version 12.6.

5 users liked answer #16dislike answer #165
Victor Araújo profile pic
Victor Araújo

Hey guys a combination of 2 awnsers solved my problem. It was port related.

adb reverse tcp:8088 tcp:8088
react-native run-android --port=8088

By doing this, the app loaded fine of my phone connected by USB. I think my AV or Vagrant or something elses in my PC was using that port.

You can change 8088 to something else if needed.

Enjoy!

5 users liked answer #17dislike answer #175
Patrick Simard profile pic
Patrick Simard

I just want to add a non-obvious possibility not covered here. I am using @react-native-community/netinfo for detecting network changes, primarily network state. To test network-off state, the WIFI switch (on the emulator) needs to be switched off. This also effectively cuts off the bridge between the emulator and the debug environment. I had not re-enabled WIFI after my tests since i was away from the computer and promptly forgot about it when i got back.

There is a possibility that this could be the case for somebody else as well and worth checking before taking any other drastic steps.

4 users liked answer #18dislike answer #184
arunmenon profile pic
arunmenon

I have also faced this issue. I resolved this following step.

Check android sdk path in Environment Veritable.

Add ANDROID_HOME = C:\Users\user_name\AppData\Local\Android\Sdk in System Variable
and C:\Users\user_name\AppData\Local\Android\Sdk\platform-tools path in System Variable

replace sharedBlacklist as below code segment,

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

in node_modules/metro-config/src/default/blacklist.js

Then run npx react-native run-android --port 9001

Happy Coding..!

4 users liked answer #19dislike answer #194
Chanaka profile pic
Chanaka

Apparently, none of the answers fixed the issue for me. I was able to run the react-native app on emulator but the same code (even when the Server was running), gave me this error when running the app on the device.

I was able to resolve it by executing the following command in the terminal:

adb reverse tcp:8081 tcp:8081

4 users liked answer #20dislike answer #204
Mahendra Liya profile pic
Mahendra Liya

I was having the same trouble, the problem for me was that adb was not in the right environment path, the error is telling you metro port, while you're in the adb, ports are killed and restarted.

Add Enviroment Variable (ADB)

  1. Open environment variables
  2. Select from the second frame PATH variable and click edit option below
  3. Click on add option
  4. Submit the sdk platform tools path C:\Users\ My User \AppData\Local\Android\Sdk\platform-tools

Note: Or depending where is located adb.exe in your machine

  1. Save changes

Run android build again

$ react-native run-android

Or

$ react-native start

$ react-native run-android
3 users liked answer #21dislike answer #213
CarlosChavarria profile pic
CarlosChavarria

In my case, I've set a proxy in my emulator. It works back to normal after I removing that proxy.

3 users liked answer #22dislike answer #223
Benson profile pic
Benson

I'm sure it some combination of the other things mentioned here like allowing clear text, which I enabled for localhost. But this was the final piece in the puzzle.

project.ext.react = [
    entryFile: "index.js",

    // ADD THESE THREE

    bundleAssetName: "index.android.bundle",
    bundleInDebug: true,
    bundleInRelease: true
]

RN: 0.61.3

3 users liked answer #23dislike answer #233
Phil Andrews profile pic
Phil Andrews

Here how I solved this issue without touching the build:

1- Closed the Virtual Device

2- Tested on Physical Device --(it works)

3- Created new Virtual Device with API 30 Android 10+

4- Try again on newly created Virtual Device, and all work like a charm.

3 users liked answer #24dislike answer #243
Feras profile pic
Feras

I experienced this just because my Wifi was mistakenly turned off on my emulator.i turned it back on and it started working fine. Hope it's helpful to someone

2 users liked answer #25dislike answer #252
Forest baba profile pic
Forest baba

possibility of this error is also the wrong path,check once

 export ANDROID_HOME=/Users/microrentindia/Library/Android/sdk/
 export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
2 users liked answer #26dislike answer #262
user3143487 profile pic
user3143487

The solution that worked for me is the following:

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
]; 

2 users liked answer #27dislike answer #272
Jorge Santos Neill profile pic
Jorge Santos Neill

update this part in metro blacklist

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];
2 users liked answer #28dislike answer #282
Hazem AbdelHamid profile pic
Hazem AbdelHamid

I have run into similar issue. npx react-native init creates .gitignore file which ignores <project>/android/app/src/debug folder. If you have later cloned this project, this folder would be missing. The solution is simple. In future add this line to the bottom of the .gitignore file.

!android/app/src/debug

For your current project ask the project creator to commit this folder. I have encountered this error with react native version 0.63

2 users liked answer #29dislike answer #292
Jakub Orsula profile pic
Jakub Orsula

Copyright © 2022 QueryThreads

All content on Query Threads is licensed under the Creative Commons Attribution-ShareAlike 3.0 license (CC BY-SA 3.0).