React tab is not showing with Chrome's react developer tools on a react-native app

Viewed 4831

I have installed the react developer tools extension in Chrome, and if I look at the list of extensions, it is listed as enabled. However, on the top menu bar, where I have Elements, Console, Sources etc, there is no React tab. I can open one of my react-native source files and even stop at a breakpoint in it.

In readme of the react developer tools gihub repository it states

The "React" tab won't show up if React can't communicate with the devtools. When the page loads, the devtools sets a global named __REACT_DEVTOOLS_GLOBAL_HOOK__, then React communicates with that hook during initialization.

(In React 0.11 and older, it was necessary to expose a global called React for the devtools to function.)

You can test this on the React website or by inspecting Facebook.

In my app folder, I am not using react directly, but I am using react-native and the relevant versions are

react-native-cli: 0.1.10
react-native: 0.21.0

If I go to the react-native site, the React tab shows up, so it is probably something to do with my react-native setup. How do I get the React tab to appear when I am inspect my react-native app?

2 Answers
Related