在 Chrome 浏览器中安装 react-devtools 调试工具有两种方案:
方案一:访问谷歌扩展程序商店直接安装(不做赘述)。
优点:操作简单方便。
缺点:国内网络可能无法直接访问谷歌扩展程序商店。
方案二:直接在 github 仓库中克隆 react-devtools。
优点:不需要访问谷歌扩展程序商店,适合国内用户
缺点:没有方案一中操作简单
本文重点介绍方案二中的每一个步骤:
步骤1:直接访问 github 仓库地址:https://github.com/facebook/react-devtools/tree/v3
步骤2:通过 npm clone <url> 克隆
例如:
a、在你的电脑桌面上创建一个文件夹:devtools。
b、打开 cmd,cd 到 devtools 文件夹中 (在 window 系统中通过 cmd 执行命令,在 mac 系统中使用 终端 执行命令)
c、执行命令 git clone https://github.com/facebook/react-devtools.git
步骤3:进入到克隆到本地的项目根目录中,可能只能看到以下文件
步骤4:通过 git checkout v3 切换到 v3 版本上,并执行 npm install 或 cnpm install
步骤5:在 cmd 中 cd 到 上图中的 shells 文件夹下的 chrome 文件夹中执行命令 node build.js
步骤6:进入上图中的 build 夹中 unpacked 文件夹就是我们需要的
步骤七:将上图中的 unpacked 文件夹拷贝到你想要拷贝到的位置,打开 chrome 浏览器 -> [设置] -> [更多工具] -> [扩展程序] -> [开发者模式]
步骤八:上图中选择 unpacked 问价夹后会看到下图中的扩展程序后重启浏览器
步骤九:重启浏览器后即安装成功,赶快创建一个 Create React App 试一试吧
参考网址:
主要参考网址://www.greatytc.com/p/8afd06135fd5
住要参考网址:https://www.cnblogs.com/shenwh/p/12067029.html
更加简单粗暴的方法:https://blog.csdn.net/newway007/article/details/102911629