react-devtools-integration.md

React DevTools Integration

NOTE Supported React Native version is >= 0.62. Please downgrade RNDebugger version to 0.10 if you're using older versions of React Native.

The React DevTools is built by facebook/react/packages/react-devtools-core.

It will open a WebSocket server to waiting React Native connection. The connection is already included in React Native (see setUpReactDevTools.js), it will keep trying to connect the React DevTools server in development mode, it should work well without any specification.

We made the server listen to a random port and inject window.__REACT_DEVTOOLS_PORT__ global variable in debugger worker.

For Android, we have the built-in adb util and it will reverse the port automatically.

Get $r global variable of React Native runtime in the console

Refer to Debugger Integration.

Question: I got Unsupported message from React DevTools

If you're using React Native version >= 0.62 and keep React Native Debugger as the latest version, here is what you can do:

In your app project, upgrade react-devtools-core dependency to match the React DevTools version:

• Use yarn resolutions, just add "react-devtools-core": "~4.13.5" (Depends on the display version of React DevTools) to resolutions of package.json.

Reference: Unsupported DevTools backend version - # React Native Debugger

Other documentations

• Getting Started
• Debugger Integration
• Redux DevTools Integration
• Apollo Client DevTools Integration
• Shortcut references
• Network inspect of Chrome Developer Tools
• Enable open in editor in console
• Config file in home directory
• Troubleshooting
• Contributing