3

I am trying to open my react-native app on an emulator, but I am continuously facing the red screen error after the initial load.

Here are few of my observations --

  1. When I run react-native run-android from my project root directory, the adb is running on port 8081. Refer the screenshot. enter image description here

  2. When the app first launches, it shows the default screen properly. Refer screenshot below.enter image description here

  3. Although it asks to edit the index.android.js, I had already added code in that file. I am not sure why it is not loading the screen on the first load. Refer screenshot below.enter image description here

  4. When I reload this screen by double tapping 'R' on my keyboard, I see the red-screen error saying that the development server could not be connected.

  5. I changed the default port 8081 to some other port number in the file server.js and gave the same port number and my machine's IP address in Developer Menu on the device.

After doing all the above steps, still I am getting the red-screen error that development server could not be connected. I am sure I am missing some silly thing, which I need to connect these dots and make the app running. Please help me. Thanks in advance!

EDIT 1:

After running react-native start, system gets stuck at this step and nothing happens.enter image description here

Saumik Bhattacharya
  • 891
  • 1
  • 12
  • 28

4 Answers4

2

Make sure you have ran react-native start If so, you can try running adb reverse tcp:8081 tcp:8081

Hope it helps.

soutot
  • 3,531
  • 1
  • 18
  • 22
  • Sorry, for showing up on this post after a long time! I am getting the error -- `js server not recognized continuing with build` whenever I am running `react-native run-android`. Also I followed your steps and whenever I run the command `react-native start` with or without resetting cache, system stays still after the step `Loading dependency graph, done` and nothing happens after that. Please refer to the snapshot added in the question. – Saumik Bhattacharya Oct 29 '17 at 19:19
1

You might need to add android:usesCleartextTraffic="true" in your AndroidManifest if you're using android-28 and above.

gumil
  • 126
  • 4
1

My problem was that I misconfigured the network_security_config.xml file which I added to the application tag in the manifest using android:networkSecurityConfig="@xml/network_security_config", according to the docs.

In android-28 and above, android:usesCleartextTraffic is disabled by default (thanks @MiguelPanelo), which means localhost gets blocked when using that config file. When I removed that file, it worked. However, upon further inspection I found that I could just add another <domain-config> tag for localhost along with my other tags which I put in for security purposes, like so:

<domain-config cleartextTrafficPermitted="true">
    <domain includeSubdomains="true">localhost</domain>
</domain-config>
instanceof
  • 1,404
  • 23
  • 30
0

Make sure that you did not get any error in the server while changing the code in index.android.js. Because the error you might have got in the server might cause the server to break connection internally. so,

  • Try to close the server.
  • run react-native start --reset-cache
  • reload the app.

It might solve your problem. Hope it Helps.

Anuj.T
  • 1,598
  • 16
  • 31
Sumanth U
  • 144
  • 8
  • Sorry, for showing up on this post so after a long time! I am getting the error -- `js server not recognized continuing with build` whenever I am running `react-native run-android`. Also I followed your steps and whenever I run the command `react-native start` with or without resetting cache, system stays still after the step `Loading dependency graph, done` and nothing happens after that. Please refer to the snapshot added in the question. – Saumik Bhattacharya Oct 29 '17 at 19:14