Menu
I have installed React Developer Tools Chrome browser extension. But i cannot see the React tab in developer tools instead there are new tabs named "Components" & "Profiler".
I re-installed the extension, restarted the browser and computer, checked "Allow access to file URLs" under chrome://extensions/ . I navigated to a url with react https://reactjs.org/tutorial/tutorial.html & yet react tab doesn't appear. However the chrome plugin (react detector in top right of the browser) indicates that react.js in it. How do I get the React tab to appear ?
I am using "react": "16.8.6"
377
Hit refresh in chrome and you will see the react-devtools extension color change into red indicating that it is ready to work . Then open inspect in chrome and you will see the two components and profiler options. Show activity on this post.
You will get a new tab titled “React” in your Chrome DevTools. This tab shows you a list of the root React Components that are rendered on the page as well as the subcomponents that each root renders. Selecting a Component in this tab allows you to view and edit its props and state in the panel on the right.
You can't see React tab because, Facebook have updated React DevTools to have Components and Profiler Tabs. ⚛️ Components tab serves same purpose as React tab in older versions. From description,
You will get two new tabs in your Chrome DevTools: "⚛️ Components" and "⚛️ Profiler".
The Components tab shows you the root React components that were rendered on the page, as well as the subcomponents that they ended up rendering.
This can be seen from version 4.0.0. See the release notes here
118
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
