Menu
The quickest way to open React Devtools is to right click your page and select inspect. If you've used Chrome or Firefox's developer tools, this view should look a little familiar to you.
Use React developer tools in Chrome By selecting one of the components in the tree, you can inspect and edit its current props and state in the panel on the right. In the breadcrumbs you can inspect the selected component, the component that created it, the component that created that one, and so on.
If you opened a local html file in your browser (file://...) then you must first open chrome extensions and check off "Allow access to file URLs".
You no longer need to do anything.
For older react versions, the main requirement is that window.React is set. If you're using a module system:
if (typeof window !== 'undefined') {
window.React = React;
}
This should usually be done in your main source file.
That message always displays, even if the React dev tools are installed and working on the current page. This will be fixed in 0.12 (and is already fixed in master). See https://github.com/facebook/react/pull/953.
React tools also won't work if you're in incognito mode. Might help someone.
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