说在前面:这个插件的安装教程网上能找到不少,我就想问一句:你们自己写的教程,你们照着教程能安装成功吗,你们安装过吗,对你们无fuck说,坑!

开始干货:

React Dev Tools 现在的版本支持chrome和Firefox,但目前对Firefox的支持仍不是很好,建议用chrome,那么问题来了,Google被墙了,普通方法安装已经行不通了,需要先从GitHub上下载源码包进行编译安装。

1.使用任意浏览器打开网址:https://github.com/facebook/react-devtools/releases ,打开后页面顶部如图所示

浏览器-安装 react-devtools

下载到本地后解压缩,得到一个文件夹react-devtools-v3.4.2(截止到目前最新版本为v3.4.2,之后更新其他版本安装方法同理)

浏览器-安装 react-devtools

2.在命令行工具内找到文件夹位置,为了方便我使用VS code直接打开文件夹,然后使用VS code编辑器的命令行工具在文件夹下运行 npm install 命令,等待安装成功

3.运行 cd shells 命令,进入shells子文件夹下

浏览器-安装 react-devtools
4.再运行 cd chrome 命令进入chrome文件夹下

浏览器-安装 react-devtools

5.运行 node build.js 命令,成功后会有提示,如图

浏览器-安装 react-devtools

6.根据提示运行 yarn run test:chrome 命令,chrome浏览器会自动启动,此时你会发现React devtools 已经安装成功了

 

浏览器-安装 react-devtools

浏览器-安装 react-devtools

每次调试前先运行yarn run test:chrome 或者npm run test:chrome 

浏览器-安装 react-devtools

 

相关文章:

  • 2021-06-11
  • 2021-08-10
  • 2021-05-15
  • 2021-04-26
  • 2021-04-29
  • 2021-05-09
猜你喜欢
  • 2022-12-23
  • 2022-01-08
  • 2021-11-24
  • 2021-12-14
  • 2021-06-23
  • 2021-11-28
  • 2021-08-21
相关资源
相似解决方案