@(关于chrome中如何安装react-devtools开发工具)

关于chrome中如何安装react-devtools开发工具

安装react-devtools的前提是本地安装了git 以及node

1.首先访问官网：https://github.com/facebook/react-devtools/tree/v3

2.按照提示,复件项目文件的github地址

3.在命令行中运行命令

git clone https://github.com/facebook/react-devtools.git

4.当文件下载完成后,在项目根目录(react-devtools )下运行以下命令,从远程仓库下载v3分支代码

git checkout v3

5.当文件下载之后,再运行以下命令

==npm install ==
或
yarn install

6.安装好依赖之后,再运行

npm run build:extension:chrome
或
yarn run build:extension:chrome

7.react-devtools扩展程序已经生成好了,此时你可以通过以下两种方法进行使用该程序

第一种方法: 运行以下命令(仅测试用)

npm run test:chrome
或
yarn run test:chrome

• 运行结果如下图所示:
  

第二种方法: 运行以下命令(在chrom浏览器中加载该扩展程序),具体方法如下:

1. 进入chrom浏览器的设置界面, 找到扩展程序
   
2. 打开开发者模式,选择加载已解压的扩展程序
   
   3.选择unpacked文件进行加载, 其目录路径为
   项目根目录 react-devtools\shells\chrome\build
3. 加载完成之后,你会在chrom浏览器的扩展程序里看到该扩展程序
   
   参考:https://www.jianshu.com/p/8afd06135fd5