React安装React Devtools调试工具
在运行一个React项目的时候浏览器控制台会提醒你去安装react devtools调试工具。
Download the React DevTools for a better development experience: https://fb.me/react-devtools
看到浏览器控制台这种说明,很是不舒服,于是就安装了react devtools浏览器扩展插件。
https://fb.me/react-devtools 此链接打不开,应该需要FQ。
所以还是直接从github上面下载:https://github.com/facebook/react-devtools
1.git上下载react-devtools文件到本地: git clone https://github.com/facebook/react-devtools

2.进入到react-devtools文件夹,用npm安装依赖。
cd react-devtools
npm --registry https://registry.npm.taobao.org install

..............................华丽的省略号................................
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN ajv-errors@1.0.1 requires a peer of ajv@>=5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN acorn-dynamic-import@4.0.0 requires a peer of acorn@^6.0.0 but none is installed. You must install peer dependencies yourself.
added 1833 packages from 819 contributors in 38.076s //success
3.安装依赖成功后,打包程序扩展;npm run build:extension:chrome

出现这个就说明安装成功了。
并且会在你的项目中生成一个新的文件夹:react-project ▸ react ▸ react-devtools ▸ shells ▸ chrome ▸ build

4.打开Chrome扩展程序chrome://extensions/,加载已解压的扩展程序,选择第三部生成的unpacked文件夹。这时就会添加一个新的扩展程序react-devtools,并在你的浏览器右上角会有一个react标志,代表安装成功。

React安装React Devtools调试工具的更多相关文章
- Vue安装Vue Devtools调试工具提示 Error: Cannot find module '@vue-devtools/build-tools' 解决办法
我看网络上面安装Vue Devtools 调试工具的步骤几乎都是按照文章链接里的步骤进行安装, 但是在最终执行编译命令的时候 :npm run build ,提示如下错误: 尝试了很多方法,都不能解决 ...
- npm 安装React Devtools调试工具
有时候没有***工具时,怎么安装React DevTool, 其一直接搜索到Chrome的插件安装即可. 其二, 可以通过下载github上的react-devtools, 然后打包,最后导入chro ...
- react 工程起步 安装chrome 开发调试工具 react developer tools 及初建一个react 项目...
1.安装react 开发工具 1.下载 chrome react developer tools 下载地址:https://pan.baidu.com/s/1eSZsXDC 下载好是 ...
- 【React】react&&redux调试工具
一.React调试工具 1.安装 react-developer-tools,在chrome应用商店进行下载,因为网络限制原因,我们可以使用火狐浏览器进行安装下载 a.打开火狐浏览器的附加组件 b.搜 ...
- 7. react 基础 - React Developer Tools 的安装 及 使用
1. 安装 react 开发调试工具 React Developer Tools 打开 chrome 浏览器访问 chrome://extensions/ 点击右上角的 拓展程序 -> 打开 c ...
- 史上最全Windows版本搭建安装React Native环境配置
史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有很多坑要跳,为了帮助新手快速无误的 ...
- 史上最详细Windows版本搭建安装React Native环境配置 转载,比官网的靠谱亲测可用
史上最详细Windows版本搭建安装React Native环境配置 2016/01/29 | React Native技术文章 | Sky丶清| 95条评论 | 33530 views ...
- 【问题与解决】Mac OS通过 npm 安装 React Native 报错(checkPermissions Missing write access to /usr/local/lib/node_modules)
报错情况: 当Mac OS通过 npm 安装 React Native 报错,警告文字为:checkPermissions Missing write access to /usr/local/lib ...
- MacOS安装react。问题 -- npm全局包的权限问题
网上的教程有好多,在这里不一一列举,我只介绍我今天安装成功的步骤 首先,在安装react之前要先配置好node 1.安装node 在这里下载node的安装包https://nodejs.org/en/ ...
随机推荐
- 20145226夏艺华 Exp6 信息搜集与漏洞扫描
20145226夏艺华 Exp6 信息搜集与漏洞扫描 基础问题回答 哪些组织负责DNS,IP的管理? · 全球根服务器均由美国政府授权的ICANN统一管理,负责全球的域名根服务器.DNS和IP地址管理 ...
- Wcf服务测试自带工具
Visual Studio 安装包文件夹 \Common7\IDE\WcfTestClient.exe
- PHPStrom 里修改Emmet对php的自动扩展
PHPStrom 7.1.3 Emmet 想必大家都比较清楚了.Emmet有个特点,对于匹配不到的符号,仍然会自动扩展为标签的形式,比如我输入aaaa,然后按tab,会自动扩展为<aaaa> ...
- jaron插件的用法
一.dict字典插件的基本用法: <%@ taglib prefix="dict" uri="http://www.evan.jaron.com/tags/dict ...
- Oracle dba权限下修改用户密码 授予用户权限 解锁用户
1.修改用户密码 alter user scott identified by 123 2.授予用户权限 grant connect,resource to scott 3.解锁用户 alter us ...
- sql server数据库中char,varchar,nvarchar字段的区别
Char,varchar,nvarchar字段是sql server数据库中的三种字段类型.好多人在选择存储的时候不知道如何抉择,我给大家讲下这个三个字段类型的区别. Char(n)是长度为n个字节的 ...
- 「LeetCode」0952-Largest Component Size by Common Factor(Go)
分析 注意到要求的是最大的连通分量,那么我们可以先打素数表(唯一分解定理),然后对每个要求的数,将他们同分解出的质因子相连(维护一个并查集),然后求出最大的联通分量即可. 这里使用了筛法求素数.初始化 ...
- 4.1 所有类型都从 System.Object 派生
"运行时"要求各个类型最终都从 System.Object 派生.(显示继承/隐式继承) 提供公共方法(public): Equals 判断两个对象相等,true 表示相等. Ge ...
- 【ZABBIX】ZABBIX3.2升级3.4
小贴士 1.停止zabbix服务 service zabbix_server stop service zabbix_agentd stop /usr/local/zabbix/sbin/zabbix ...
- eos TODO EOS区块链上EOSJS和scatter开发dApp
由于我一直在深入研究EOS dApp的开发,我看了不少好文章.在这里,我汇总了下做一些研究后得到的所有知识.在本文中,我将解释如何使用EOSJS和scatter.我假设你对智能合约以及如何在EOS区块 ...