By Goba


2017-06-08 22:26:07 8 Comments

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:

  1. cd (project directory)
  2. react-native start
  3. react-native run-android

30 comments

@yasincidem 2019-06-25 20:08:46

If you have entered 'Debug server host & port for device' in Dev Settings, make sure you remove what you have entered.

@A J 2019-06-25 20:46:02

Add this as a comment

@yasincidem 2019-06-26 17:49:21

After 50 reputation

@Tung Tran 2019-05-10 04:47:32

Go to Dev Settings -> to Debug server host & port for device -> Input your Computer Wifi IP address (Mac OS : Go to System Preferences -> Wifi to get Wifi IP address)

Final Rebuild application and Run

@bhw1899 2019-05-08 01:57:34

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)

  1. Check if your assets folder exist?: \android\app\src\main\assets If not, create one.

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

  1. Then copy this file into your assets folder(\android\app\src\main\assets\index.android.bundle)

  2. Go back to powershell or command console, execute:

react-native run-android --variant=release

It should work.

Good luck!

@Ian Zhong 2019-04-04 08:54:06

Use mkdir ... /assets && react-native bundle --platform.. CAN NOT solve this problem completely,

Notice that, you have to run this command regenerate the files every time when code edited, and it show error again after Reload or Debug JS Remotely.

The fundamental cause this issue is your app cannot connect with server (because of some unknown reason)

Here is my solution:

  • Firstly, start service in other host and port like:

    react-native start --port 8082 --host 0.0.0.0

  • Then, open app dev menu > Dev Setting > Debug server host for device

  • Input youripv4address:8082
  • dev menu > Reload

Hope this helps

@Sunny Khan 2019-04-18 11:15:49

@majcode 2019-02-12 07:24:59

I think the first thing to do before all the other solutions is:

1. Check whether your device is online or not?

2. If you are running the application on the real device then the device should be on the same network where the development server is running.

More information at this page.

@Rumit Patel 2019-02-12 07:51:10

While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Answers that are little more than a link may be deleted.

@majcode 2019-02-13 07:31:14

@RumitPatel, I did add essential parts, I was just sourcing where I got the answer

@Rumit Patel 2019-02-13 10:05:22

No problem with that. It would be good to additionally explain how your solution would work.

@Burim Syla 2019-01-30 22:46:29

Just close visual studio and close cmd terminal. Reopen and restart app again.

@Poonam 2019-01-21 12:28:57

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

@Anil Ravsaheb Ghodake 2019-01-21 12:30:05

Thanks, its also helps me.

@Widy Graycloud 2018-12-06 19:38:36

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

@neurosnap 2018-11-15 19:25:02

I have 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

@bencergazda 2018-11-28 16:36:28

Thank you. This was my issue after upgrading targetSdkVersion to 28.

@Bruno Lemos 2018-12-11 04:35:55

This works! Thanks.

@Ron 2019-01-21 10:43:19

This works. Thank you !!

@Andrew Koster 2019-03-28 19:45:28

This is the correct answer. It actually fixes the network communication problem.

@Tur1ng 2019-03-29 01:10:53

This is the solution used in React Native v0.59.2.

@greg7gkb 2019-04-09 00:14:56

Thanks for flagging this - was completely preventing my RN app from loading. Disappointing that there wasn't better error messaging around this :/

@animation123 2019-06-01 21:43:21

Thank you so much worked like a charm!

@Juan P. Ortiz 2019-06-05 18:57:11

Thanks! It worked

@Yaron Levi 2019-06-20 10:42:32

Works! If I see you in person, I would give you a medal (-:

@Sameer 2018-10-01 11:56:06

Follow this, Worked for me.

https://github.com/react-community/lottie-react-native/issues/269

Go to your project directory and check if this folder exists android/app/src/main/assets i) If it exists then delete two files viz index.android.bundle and index.android.bundle.meta ii) If the folder assets doesn't exist then create the assets directory there.

From your root project directory do cd android && ./gradlew clean

Finally, navigate back to the root directory and check if there is one single entry file called index.js i) 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

ii) 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

@VK1 2018-11-09 06:52:39

Your comment helped me immensely. I'm not sure why I needed to delete the two bundle files. But your directions would perfectly! Thank you so much!

@mukeshmandiwal 2018-08-15 19:18:13

1 Go to your project directory and check if this folder exists android/app/src/main/assets

  1. If it exists then delete two files viz index.android.bundle and index.android.bundle.meta
  2. 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

    1. Now run react-native run-android

@Harat 2018-07-24 18:28:32

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.

  1. Firstly run sudo chown user-name-of-pc /dev/kvm in my case.
  2. While debugging from your Android phone, select Use USB to Transfer photos (PTP).

  3. Create Folder assets in project-name/android/app/src/main

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

  1. run command ./studio.sh in android-studio/bin directory. It will opens up Android Studio.

  2. run command react-native run-android.

enter image description here

@sumit kumar pradhan 2018-06-24 15:40:05

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.

@Kylo Ren 2018-10-26 10:35:17

Automating it by updating the script worked for me

@Gurbela 2018-06-08 10:25:54

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

@llioor 2018-06-27 14:06:19

Works for Android! clean and easy!

@Chandni 2018-07-30 10:54:15

not working for me

@Lucas Bustamante 2019-02-10 19:31:39

Deleting android/app/bin folder on Windows worked as well. I had built it the project directly from Android Studio, instead of running react-native run-android, and it seems it built something wrong that I had to delete manually.

@UMUT 2018-06-07 22:14:19

On Windows

if you sure, node.js is installed successfuly on your system, please check system environment variables and add C:\windows\system32 in system variables Paths

@RamiroIsBack 2018-05-09 21:39:50

For all of you guys who are developing from a create-react-native-app and ejected, and have this issue in development, this is what worked for me just a little detail from the accepted answer

(in project directory) mkdir android/app/src/main/assets

here comes the part that changes cos you are in development get rid of the --dev: false part:

react-native bundle --platform android --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

after that close all terminals, erase the build folder from android/app/ to make sure you start clean to build your app, open a new terminal, and

(in project directory) npm run android

will prompt the packager console (in another terminal) and build successfully

@Lindoélio Lázaro 2018-04-18 21:48:27

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

@Nguyễn Phúc 2018-04-17 08:30:36

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

@Hemanth 2018-10-04 06:02:41

This saved my life..

@Nguyễn Phúc 2018-10-05 08:30:41

thanks! :D you're wellcome

@efkan 2018-04-17 07:32:23

In my case, I'd forgotten the Android Emulator wifi as disabled. To solve the issue, I just swiped down the notification bar to expand menu and to enable Wifi connection.

After activating Wifi connection, the problem has been resolved in my case.

@Nguyễn Phúc 2018-04-04 02:01:22

i resolve it by this cmd :

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

@Grace Chandler 2018-04-02 19:38:34

I encountered this issue not with a real device, but with an emulator. I fixed it by running react-native start in the terminal before trying to run the code with android studio. I never encountered this issue when running react-native run-android in the terminal.

@Oliver Hader 2018-04-02 20:20:00

Thx for your answer. What's the difference to the existing answers and the original question (which mentions calling react-native start as well)?

@Rohit Bansal 2018-03-27 12:26:19

Image

I am facing this issue, lot of search and I resolved that issue.

c:\ProjectFolder\ProjectName> 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

Than Run the react native :

c:\ProjectFolder\ProjectName>react-native run-android

@Tyler 2018-04-23 19:47:38

The screenshot is a little irrelevant to the answer.

@Ajay Mistry 2018-05-25 10:03:23

i have same issue ..and i tried it but no success

@mthakuri 2017-06-15 10:17:43

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.

@yairsz 2017-08-30 19:22:20

I was getting this problem when running directly from android studio. using react-native run-android fixed it

@Zac Grierson 2018-01-09 00:40:10

Your link does not work anymore, you should reference key helpful parts in future to keep information alive after its source dies.

@IgorGanapolsky 2018-01-11 15:53:30

So how to run this on a real device??

@Ivan Titkov 2018-01-18 09:13:27

@IgorGanapolsky i have the same issue and fixed it with official documentation, you can easily check your environment facebook.github.io/react-native/docs/running-on-device.html I can't load porj from android studio (and android folder) but i could do it with root folder of project and terminal.

@nadia davari 2018-03-12 11:39:00

I had this issue when i was trying to debug my code , (in using Toggle inspector in my android phone and react development ) , I did this simple steps :

  1. Open menu in phone ( where Reload is , I can open it by long press on back-button Or Shaking the phone ) enter image description here
  2. tap Dev Setting
  3. in Debugging -> Debug Server host & port for device should be empty Note : if you wrote port or anything here ( for debugging ) you should clear it.

@Darshan Pania 2017-10-31 12:25:58

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

@Tom 2017-12-07 23:34:20

Kinda sad that FB releases a new version, and instead of fixing this bug - which is clearly hitting tons of people - they break the accepted work-around!

@IgorGanapolsky 2018-01-11 15:51:59

error: option '--bundle-output' missing

@Darshan Pania 2018-01-15 08:12:57

@IgorGanapolsky Make sure you have an index.bundle file in your assets folder

@IgorGanapolsky 2018-01-15 14:08:10

@DarshanPania What does that file do?

@Darshan Pania 2018-01-29 09:48:34

@IgorGanapolsky That JS file is an entry point into your app. From RN 0.49 onwards there is only one file index.js instead of index.android.js or index.ios.js

@Green 2018-05-24 10:28:26

ENOENT: no such file or directory, open 'android/app/src/main/assets/index.android.bundle'

@Darshan Pania 2018-05-25 08:25:15

@Green You can do a quick search for index.android.bundle in your project

@pashute 2018-06-18 04:47:00

After the react-native bundle command you wait till it says: Loading graph done. and Ctrl-C that or exit the command window. Then run the react-native run-android.

@Chandni 2018-07-31 13:51:03

Thanks it worked for me.

@Taohidul Islam 2019-01-09 15:11:19

for linux : sudo 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

@Andrew Koster 2019-03-28 19:48:17

This is a hack, and it forces you to run this command and regenerate the files every time. The correct answer is here: stackoverflow.com/questions/44446523/…

@Mudassir Khan 2018-01-23 10:38:26

I was also facing this problem because when i run projects on emulator its working fine but on 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 i.e.cd C:Development\Android\Sdk\Platform-tools

2nd step:now run this command : adb devices

after this command check your device listed in command propmt

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

@Sudhanva Patil 2017-12-27 11:55:09

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.

@Thien Nhan Nguyen 2017-07-16 16:46:42

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.

@Pixelartist 2017-10-01 20:31:42

even though it is not really connected - this is one of the very common problems and it works as Thien described

@Kreozot 2017-12-17 15:11:04

This solved my case, thank you!

@Indrek Ruubel 2018-01-08 18:29:56

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

@Chheng Chansopheaktra 2017-12-30 17:23:06

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.

Related Questions

Sponsored Content

23 Answered Questions

[SOLVED] Android failed to load JS bundle

3 Answered Questions

2 Answered Questions

unable to load script from assets 'index.android.bundle'.- React Native

  • 2018-08-24 14:01:33
  • surya kommana
  • 1327 View
  • 0 Score
  • 2 Answer
  • Tags:   android

2 Answered Questions

[SOLVED] Unable to load scripts from bundle "index.android.bundle"

13 Answered Questions

[SOLVED] unable to load script from assets 'index.android.bundle'

34 Answered Questions

[SOLVED] Android Studio: Add jar as library?

5 Answered Questions

1 Answered Questions

8 Answered Questions

[SOLVED] Android error: Failed to install *.apk on device *: timeout

Sponsored Content