Unable to connect with remote debugger

Question

I\'m using React.JS and when I do react-native run-android (with my device plugged in) I see a blank page. When I shake the device and select Debug JS Rem

Answer 1

Inculding all impressive answers the expert developers specially Ribamar Santos provided, if you didn't get it working, you must check something more tricky!

Something like Airplane mode of your (emulated) phone! Or your network status of Emulator (Data status and Voice status on Cellular tab of Emulator configuration) that might be manipulated to don't express network! for some emulation needs!

I've overcome to this problem by this trick! It was a bit breathtaking debug to find this hole!

Answer 2

Try adding this

package.json

devDependencies: {
//...    
    "@react-native-community/cli-debugger-ui": "4.7.0"
}

Terminate everything.

• npm install
• npx react-native start
• npx react-native run-android

Reference: https://github.com/react-native-community/cli/issues/1081#issuecomment-614223917

Answer 3

1. react-native start --reset-cache in one tab and react-native run-android in another
2. adb reverse tcp:8081 tcp:8081 ( so you could add it to your scripts and just run yarn run adb-reverse)
3. If you're using android, Instead of shake your phone a great tip is run adb commands.

So you can run:

• adb shell input keyevent 82 (menu option )
• adb shell input keyevent 46 46 ( reload )

Answer 4

My case is that when I tap enable remote JS debugging, it will launch chrome, but can not connect to it.

I have tried to run:

adb reverse tcp:8081 tcp:8081 

, did but not work.

I uninstalled my chrome totally and install a new one. And it works.

Answer 5

Make sure that the node server to provide the bundle is running in the background. To run start the server use npm start or react-native start and keep the tab open during development

Answer 6

I had a similar issue that led me to this question. In my browser debugger I was getting this error message:

Access to fetch at 'http://localhost:8081/index.delta?platform=android&dev=true&minify=false' from origin 'http://127.0.0.1:8081' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

It took me awhile to realize I was using 127.0.0.1:8081 instead of localhost:8081 for my debugger.

To fix it, I simply had to change Chrome from:

http://127.0.0.1:8081/debugger-ui/

to

http://localhost:8081/debugger-ui/