React Devtools
Has anyone had any success using the react devtools in the new tab page? The redux one works but not the react one for some reason. I went to the chrome extension settings and gave it permissions to access file URLs but that didnt help
11 Replies
Interesting... I wonder why redux extension works but not react itself... Perhaps redux itself has a debug port that they can hook on with bgsw or something like that?
Maybe! Is there any way to run the program outside of the chrome extension?
Tried running a http server on the dev build folder but got this error:
Uncaught Error: This script should only be loaded in a browser extension.. I believe this is from the webext polyfill but I also believe that the storage package will also complain (at least it did when running in jest).Let me attempt this: https://www.npmjs.com/package/react-devtools
npm
react-devtools
Use react-devtools outside of the browser. Latest version: 4.27.1, last published: a month ago. Start using react-devtools in your project by running
npm i react-devtools. There are 25 other projects in the npm registry using react-devtools.Stack Overflow
How to add react-devtools for chrome extension development?
I am inserting a react component into a web page - Everything seems to work well but im not able to get the react dev tools working.
After reading online it seems like this could be caused by:
React
Might need to embed it,
npm
react-devtools-core
Use react-devtools outside of the browser. Latest version: 4.27.1, last published: a month ago. Start using react-devtools-core in your project by running
npm i react-devtools-core. There are 276 other projects in the npm registry using react-devtools-core.Yeah getting stuck at adding
<script src="http://localhost:3001"></script> cuz of the CSP
Got it by manually building for firefox mv2, then updating the csp to allow localhost:3001 lol
Was able to solve all of my issues using the profiler ^! Should I make an issue on github? Maybe theres some way we can properly include the script on dev so all a user has to do is run npx react-devtoolsabsolutely
GitHub
[RFC] Add React Devtools Support · Issue #396 · PlasmoHQ/plasmo
How do you envision this feature/change to look/work like? Ideally the React chrome extension in the devtools should work. If not, then running npx react-devtools should work What is the purpose of...
@nahtnam how did you get redux devtools to work? Just set devTools = true (or process.env.NODE_ENV !== "production") in configureStore?
I built the extension, then ran a http server. It was a new tab page so it loaded fine