安装React Devtools

差不多小姐姐
2,622 阅读1分钟

  1. 打开react-devtools官网

  2. 切换到v3分支，点击下载ZIP压缩包

image.png

  1. 解压后，用编辑器打开，我这里用的是vscode，运行npm i 安装依赖包

  2. 安装成功后，切换目录到 shells/chorme，运行node build.js

image.png

  1. 运行成功后，会发现多了一个unpacked文件夹

image.png

  1. 打开谷歌浏览器→设置→扩展程序，打开开发者模式，点击加载一姐呀的扩展程序，选择刚生成的unpacked文件夹，确定后，你会发现React Developer Tools安装成功了！

image.png

image.png

安装成功后，启动新项目，页面一片空白，打开控制台发现竟然报错了： TypeError: Cannot read properties of undefined (reading 'forEach')

image.png

根据报错信息 at Object../node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js在项目中打开对应文件，注释第八行代码，重新启动项目，发现页面正常显示了。（搜索引擎找到的大多是直接关闭React Devtools开发者工具，但是这样没有解决根本问题）

image.png

avatar
文章
阅读
粉丝