npm 安装 react-devtools
由于不能科学的上网。网上看资料装上了这个插件,装的过程有点坑。记录一下,希望能帮到和我一样的新手。
1.第一步,克隆下远程仓库的东西。
桌面右键,git-bash。然后输入:
git clone https://github.com/facebook/react-devtools.git
这个过程耗时比较长。
结果:

2.第二步, 进入到react-devtools目录,安装依赖
cd react-devtools
npm install
过程耗时长。安装碰上的情况。如下:
admin@battle MINGW64 ~/Desktop
$ cd react-devtools admin@battle MINGW64 ~/Desktop/react-devtools (master)
$ npm install
npm WARN deprecated clipboard-js@0.3.: Please migrate to https://github.com/lgarron/clipboard-polyfill
npm WARN deprecated core-js@1.2.: core-js@<2.6. is no longer maintained. Please, upgrade to core-js@ or at least to actual version of core-js@.
npm WARN deprecated gulp-util@3.0.: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5
npm WARN deprecated cross-spawn-async@2.2.: cross-spawn no longer requires a build toolchain, use it instead
npm WARN deprecated firefox-client@0.3.: Package no longer supported. Contact support@npmjs.com for more info.
npm WARN deprecated circular-json@0.3.: CircularJSON is in maintenance only, flatted is its successor.
npm WARN deprecated js-select@0.6.: Package no longer supported. Contact support@npmjs.com for more info.
npm WARN deprecated hawk@3.1.: This module moved to @hapi/hawk. Please make sure to switch over as this distribution is no longer supported and may contain bugs and critical security issues.
npm WARN deprecated left-pad@1.3.: use String.prototype.padStart()
npm WARN deprecated joi@6.10.: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated sntp@1.0.: This module moved to @hapi/sntp. Please make sure to switch over as this distribution is no longer supported and may contain bugs and critical security issues.
npm WARN deprecated cryptiles@2.0.: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated topo@1.1.: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated hoek@2.16.: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated boom@2.10.: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial). > dtrace-provider@0.8. install C:\Users\admin\Desktop\react-devtools\node_modules\dtrace-provider
> node-gyp rebuild || node suppress-error.js C:\Users\admin\Desktop\react-devtools\node_modules\dtrace-provider>if not defined npm_config_node_gyp (node "C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild ) else (node "C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" rebuild )
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack at PythonFinder.failNoPython (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js::)
gyp ERR! stack at PythonFinder.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js::)
gyp ERR! stack at C:\Program Files\nodejs\node_modules\npm\node_modules\graceful-fs\polyfills.js::
gyp ERR! stack at FSReqWrap.oncomplete (fs.js::)
gyp ERR! System Windows_NT 10.0.
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
gyp ERR! cwd C:\Users\admin\Desktop\react-devtools\node_modules\dtrace-provider
gyp ERR! node -v v10.15.3
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok > command-join@2.0. postinstall C:\Users\admin\Desktop\react-devtools\node_modules\command-join
> npx -p @seangenabe/tnx tnx || exit npx: 安装成功,用时 3.104 秒 Thanks for installing command-join! If you like this package, be sure to star its repo,
and please consider donating: https://seangenabe.netlify.com/donate > core-js@2.6. postinstall C:\Users\admin\Desktop\react-devtools\node_modules\core-js
> node scripts/postinstall || echo "ignore" Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library! The project needs your help! Please consider supporting of core-js on Open Collective or Patreon:
> https://opencollective.com/core-js
> https://www.patreon.com/zloirock Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -) > core-js-pure@3.1. postinstall C:\Users\admin\Desktop\react-devtools\node_modules\core-js-pure
> node scripts/postinstall || echo "ignore" Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library! The project needs your help! Please consider supporting of core-js on Open Collective or Patreon:
> https://opencollective.com/core-js
> https://www.patreon.com/zloirock Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -) > spawn-sync@1.0. postinstall C:\Users\admin\Desktop\react-devtools\node_modules\spawn-sync
> node postinstall npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN ajv-errors@1.0. requires a peer of ajv@>=5.0. but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2. (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) added packages from contributors and audited packages in .133s
found vulnerabilities ( low, moderate, high, critical)
run `npm audit fix` to fix them, or `npm audit` for details
直接忽略了。。继续下一步。
3.打包一份扩展程序。如下:
npm run build:extension:chrome
结果:

这个时候就可以在react-devtools目录下找到shells--chrome--build--unpacked文件夹。
4.打开chrome,地址栏输出:chrome://extensions/。 左上角点击加载已解压的扩展程序。把unpacked文件夹放进去了。
大功告成,右上角多了个react图标。

npm 安装 react-devtools的更多相关文章
- npm 安装React Devtools调试工具
有时候没有***工具时,怎么安装React DevTool, 其一直接搜索到Chrome的插件安装即可. 其二, 可以通过下载github上的react-devtools, 然后打包,最后导入chro ...
- React安装React Devtools调试工具
在运行一个React项目的时候浏览器控制台会提醒你去安装react devtools调试工具. Download the React DevTools for a better development ...
- 【问题与解决】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 ...
- npm安装cnpm、vue、react
安装cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org 安装vuecnpm install --global vue- ...
- MacOS安装react。问题 -- npm全局包的权限问题
网上的教程有好多,在这里不一一列举,我只介绍我今天安装成功的步骤 首先,在安装react之前要先配置好node 1.安装node 在这里下载node的安装包https://nodejs.org/en/ ...
- 史上最全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 ...
- 利用npm安装/删除/发布/更新/撤销发布包 --社会我npm哥,好用话不多
一.什么是npm? npm是javascript的包管理工具,是前端模块化下的一个标志性产物 简单地地说,就是通过npm下载模块,复用已有的代码,提高工作效率 1.从社区的角度:把针对某一特定 ...
- React DevTools
[React DevTools] 在应用商店搜索安装.F12可打开.如果是react应用,在最右排会显示react标签. 参考:https://github.com/facebook/react-de ...
- 【npm】利用npm安装/删除/发布/更新/撤销发布包
什么是npm? npm是javascript的包管理工具,是前端模块化下的一个标志性产物 简单地地说,就是通过npm下载模块,复用已有的代码,提高工作效率 1.从社区的角度:把针对某一特定问题 ...
随机推荐
- [Beta]第六次 Scrum Meeting
[Beta]第六次 Scrum Meeting 写在前面 会议时间 会议时长 会议地点 2019/5/14 22:00 30min 大运村公寓6F寝室 附Github仓库:WEDO 例会照片 (两人回 ...
- mysql索引原理及优化(一)
什么是索引 索引用来快速地寻找那些具有特定值的记录,所有MySQL索引都以B-tree的形式保存.如果没有索引,执行查询时MySQL必须从第一个记录开始扫描整个表的所有记录,直至找到符合要求的记录.表 ...
- pytorch保证每次运行使用的随机数都相同的方法
其实在代码的开头添加下面几句话即可: # 保证训练时获取的随机数都是一样的 init_seed = torch.manual_seed(init_seed) torch.cuda.manual_see ...
- Python 初级 6 循环 (三)
一.复习 1 计算循环(for循环) for looper in [1, 2, 3, 4, 5]: print("hello") 1) looper的值从第0个数1开始 2) 对应 ...
- eclipse配置maven环境 腾讯课堂的(还没试)
下载和基本配置 https://ke.qq.com/webcourse/index.html#cid=434021&term_id=100518216&taid=37765432689 ...
- Archer和ArcherUI配置说明
如果Bladex的网关端口是80,则需要修改Archer服务端口,并修改ArcherUI的vue.config.js的端口
- LeetCode:接雨水【42】
LeetCode:接雨水[42] 题目描述 给定 n 个非负整数表示每个宽度为 1 的柱子的高度图,计算按此排列的柱子,下雨之后能接多少雨水. 上面是由数组 [0,1,0,2,1,0,1,3,2,1, ...
- 画图前端:mermaid。时序图/类图/甘特图/流程图/状态图/饼图。类似工具:Typora
文档 https://mermaidjs.github.io/#/ cdn https://www.bootcdn.cn/mermaid/ 在线编辑 https://mermaidjs.github. ...
- ddl语法
创建表: create table 表名 ( 字段1 varchar2(32) not null primary key, 字段2 date not null ) tablespace 表空间名 事务 ...
- 【剑指offer】面试题 21. 调整数组顺序使奇数位于偶数前面
面试题 21. 调整数组顺序使奇数位于偶数前面