Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Native Debugging In Google Chrome Not Working(Files not showing up in debugger)

Normally when we click on the Debug JS Remotely option a new tab opens up in the google chrome(like in the below screenshot).

enter image description here

So as seen in the above screenshot we get all the files that we are working on according to the directory.

But in my case the files don't show up in the chrome(like in the below screenshot)

enter image description here

What might be the issue ?

like image 414
Amal p Avatar asked Feb 01 '18 09:02

Amal p


People also ask

Can I debug a native app using Chrome debugger?

Use Google Chrome's DevTools to debug an app when it is running in the browser using the ionic serve command, deployed to an emulator, or on a physical device. To inspect a physical device, first you need to have developer mode enabled.

How do I open React Native debugger in Chrome?

Select Tools → Developer Tools from the Chrome Menu to open the Developer Tools. You may also access the DevTools using keyboard shortcuts ( ⌘⌥I on macOS, Ctrl Shift I on Windows).

How do I connect React Native app to debugger?

Connecting a React Native app to React Native Debugger To connect your app with React Native Debugger, you need to run your app and start debug mode. To start debug mode, shake your mobile device or press Command + Shift + Z or Ctrl + M and choose the debug option. We're all set to begin using React Native Debugger.


1 Answers

1. Choose "Open file" from this menu:

open files in debugger

2. Search for the file by typing its name:

enter image description here

3. Enjoy debugging!

like image 129
zarcode Avatar answered Oct 14 '22 14:10

zarcode