1、去git上下载react-devtools文件到本地,https://github.com/facebook/react-devtools

2、进入到react-devtools-master文件夹,用npm安装依赖

  npm --registry https://registry.npm.taobao.org install

3、安装依赖成功后,打包一份扩展程序

  npm run build:extension:chrome

4、出现一下部分信息,索命打包成功

  

5、生成文件:,react-devtools -> shells -> chrome -> build -> unpacked文件夹

6、打开chrome扩展程序chrome://extensions/,加载已解压的扩展程序,选择第3步中的生成的unpacked文件夹。

7、这时就会添加一个新的扩展程序react-devtools,并在你的浏览器右上角会有个react标志, 就表示成功啦。

chrome安装react-devtools开发工具插件的更多相关文章

  1. win10下通过编译源码方式在chrome中成功安装react-devtools开发工具插件

    win10下通过编译源码方式在chrome中成功安装react-devtools开发工具插件   1.去git上下载react-devtools文件到本地,https://github.com/fac ...

  2. python3.4学习笔记(五) IDLE显示行号问题,插件安装和其他开发工具介绍

    python3.4学习笔记(五) IDLE显示行号问题,插件安装和其他开发工具介绍 IDLE默认不能显示行号,使用ALT+G 跳到对应行号,在右下角有显示光标所在行.列.pycharm免费社区版.Su ...

  3. React-Native(二):React Native开发工具vs code配置

    从网上翻阅了一些开发react-native的开发工具时,发现其实可选的工具还是比较多的Sublime Text,WebStrom,Atom+Nuclide,vs code 等.因为我用.net生态环 ...

  4. React安装React Devtools调试工具

    在运行一个React项目的时候浏览器控制台会提醒你去安装react devtools调试工具. Download the React DevTools for a better development ...

  5. 离线安装VS 2013开发工具的方法!

    目前微软已正式发布了VS 2013的开发工具,但安装VS 2013开发工具前必须安装或升级到IE10,否则无法进行安装.本文主要介绍在Windows Server 2008 R2 SP1下离线安装IE ...

  6. React 可视化开发工具 Shadow Widget 非正经入门(之五:指令式界面设计)

    本系列博文从 Shadow Widget 作者的视角,解释该框架的设计要点.本篇解释 Shadow Widget 中类 Vue 的控制指令,与指令式界面设计相关. 1. 指令式界面设计 Vue 与 A ...

  7. React 可视化开发工具 Shadow Widget 非正经入门(之六:markdown)

    本系列博文从 Shadow Widget 作者的视角,解释该框架的设计要点.本篇讲解 Markdown 在 Shadow Widget 中的应用. Markdown 在 Shadow Widget 中 ...

  8. React 可视化开发工具 shadow-widget 的非可视开发方法

    Shadow Widget 提倡在可视设计器中开发用户界面,输出转义标签,而非 JSX.许多童鞋可能不知道 SW 同样支持用 JSX 设计界面,开发体验比原生 React 编程好出很多,本文就介绍这方 ...

  9. iOS程序员的React Native开发工具集

    本文整理了React Native iOS开发过程中有用的工具.服务.测试.库以及网站等. 工具 你可以选择不同的开发环境:DECO.EXPO或者你可以使用Nuclide+Atom,目前我使用EXPO ...

  10. npm 安装React Devtools调试工具

    有时候没有***工具时,怎么安装React DevTool, 其一直接搜索到Chrome的插件安装即可. 其二, 可以通过下载github上的react-devtools, 然后打包,最后导入chro ...

随机推荐

  1. githe和github连接,上传

    Git入门 如果你完全没有接触过Git,你现在只需要理解通过Git的语法(敲入一些命令)就可以将代码上传到远程的仓库或者下载到本地的仓库(服务器),可知我们此时应该有两个仓库,就是两个放代码的地方,一 ...

  2. JWT对SpringCloud进行系统认证和服务鉴权

    JWT对SpringCloud进行系统认证和服务鉴权 一.为什么要使用jwt?在微服务架构下的服务基本都是无状态的,传统的使用session的方式不再适用,如果使用的话需要做同步session机制,所 ...

  3. OpenGL学习(1)—— 测试OpenGL环境是否搭建成功

    一个用来验证OpenGL(glfw + glad)环境是否搭建成功的测试代码 内容为生成一个小窗口 #include <glad/glad.h> #include <GLFW/glf ...

  4. 【(图) 旅游规划 (25 分)】【Dijkstra算法】

    #include<iostream> #include<cstdio> #include<algorithm> #include<cstring> us ...

  5. Serializable的作用

    前两天接触到VO,DTO,entity这些概念,发现别人的代码中会有 implements serializable这个东西,之前并没有见过这种写法,就去了解了一下原因 import java.io. ...

  6. python开发笔记-DataFrame的使用

    今天详细做下关于DataFrame的使用,以便以后自己可以翻阅查看 DataFrame的基本特征: 1.是一个表格型数据结构 2.含有一组有序的列 3.大致可看成共享同一个index的Series集合 ...

  7. Spring框架的JDBC模板技术和事物

    Spring框架的JDBC模板技术         技术分析之Spring框架的JDBC模板技术概述  1. Spring框架中提供了很多持久层的模板类来简化编程,使用模板类编写程序会变的简单     ...

  8. Django REST framework视图

    混合类阶段(封装2次) 路由: url(r'school/$', views.SchoolView.as_view()), url(r'school/(?P<pk>\d+)/$', vie ...

  9. Centos7 修改为阿里的yum源

    1.备份本地yum源 mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo_bak 2.获取阿里yum源配置文件 ...

  10. 海康相机开发(1) SDK安装和开发

    1.1 安装包获取 从官网下载最新版本的MVS安装包,支持Windows xp.Windows 7.Windows 8.Windows 10的32和64位系统.安装过程默认即可. 官网下载链接:htt ...