有时候看网上各路大神,写如何安装react-devtools,大神就是大神,好多步骤一笔带过,导致一些学习者看的一脸懵逼,今天我给大家讲超级简单的react-devtools安装步骤,相信看过的小伙伴儿不存在懵逼状态,那就开始吧!首先声明一下,必须安装Node哦,都准备学react了,node都不叫事儿了吧,Let's go!

1.首先打开官网:https://github.com/facebook/react-devtools

发现好像搬家了,不慌不慌,继续走着

那咱就进去v3分支,地址:https://github.com/facebook/react-devtools/tree/v3,直接download ZIP格式

2.知道下载位置,解压到自己可以找见的目录下,进入到react-devtools-3目录,cnpm i一下安装一下依赖

3.再进入到react-devtools-3\shells\chrome切换到chrome目录下,运行node build.js,当前目录下会生成build目录 这个build目录下的unpacked目录就是chrome中所需react-devtools的工具扩展程序包

4.打开谷歌浏览器,网址输入chrome://extensions/

选择react-detools-3目录下的shells->chrome中build目录中的unpacked即可

到此 react-devtools安装成功!

怎样,是不是超级简单!如有问题,欢迎交流!

react-devtools超级简单安装教程的更多相关文章

  1. 一、奇妙插件Tampermonkey的简单安装教程

    奇妙插件Tampermonkey的简单安装教程 1.下载 对于浏览器而言,一般的功能并不能满足"特殊用户的需求".这时候就须要插件来帮忙了.那么讲到插件的支持多又常见的浏览器必定要 ...

  2. [YII2.0] 高级模板简单安装教程

    YIICHINA官网教程就很完善:http://www.yiichina.com/tutorial/692 但是在yii2框架安装运行init.bat报错php.exe不是内部或外部命令, 解决办法: ...

  3. pycharm 安装好,只要三部! 超级简单教程!

    pycharm的安装,确实比较麻烦,所以特意做了一期简单版本的安装教程,跟着教程走...只要三部! →下载 链接:https://pan.baidu.com/s/1JxZgAhPVKAIoM1_jpD ...

  4. CentOS 6.4 服务器版安装教程(超级详细图解)

    附:CentOS 6.4下载地址 32位:http://mirror.centos.org/centos/6.4/isos/i386/CentOS-6.4-i386-bin-DVD1to2.torre ...

  5. RHEL 6.3安装(超级详细图解教程)[转载]

        附:RHEL6.3下载地址 32位:http://rhel.ieesee.net/uingei/rhel-server-6.3-i386-dvd.iso 64位:http://rhel.iee ...

  6. CentOS 6.4安装(超级详细图解教程)

    链接地址:http://www.osyunwei.com/archives/5855.html CentOS 6.4安装(超级详细图解教程) 附:CentOS 6.4下载地址 32位:http://m ...

  7. MySQL 8.0.12 基于Windows 安装教程(超级详细)

    MySQL 8.0.12 基于Windows 安装教程(超级详细) (一步一步来,装不了你找我!) 本教程仅适用Windows系统,如果你原本装了没装上,一定要先删除原本的数据库,执行:mysqld ...

  8. Eclipse 00: 安装教程 + 汉化 + 简单创建java项目

    Java 安装教程(Eclipse) 目录: 要安装Java 要分两个步骤: 1.JDK的安装 2.Eclipse的安装 3.Eclipse汉化 4.Eclipse创建简单java项目 1和2的顺序不 ...

  9. 硬盘安装CentOS 6.0(超级详细图文教程)

    硬盘安装CentOS 6.0(超级详细图文教程) 来源:   引言: 电脑系统是Windows XP,电脑没有光驱.手头没有U盘.没有移动硬盘.电脑主板不支持U盘启动,在这种情况下想安装CentOS ...

随机推荐

  1. 使用 jQuery 实现当前页面高亮显示的通栏导航条

    index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> ...

  2. iview table绑定双击事件

    <Table <Table ref="table" highlight-row :columns="columns" :data="new ...

  3. Application对象详解

    定义// import javax.servlet.ServletContext;// ServletContext类:用于表示应用程序的上下文// 取得application对象ServletCon ...

  4. ICU lirary DownLoad

    { //https://github.com/unicode-org/icu }

  5. IE11“__doPostBack”未定义”

    IE 11 下<asp:LinkButton> 点击出现 “__doPostBack”未定义” 在项目根目录 App_Browsers 下新建 浏览器文件(.browser),让其与IE1 ...

  6. LiveTelecast直播平台技术图谱skill-map

    #直播平台技术图谱 ----##直播 ----###采集- **iOS** * HTTP Live Streaming * DirectShow- **Android** * setPreviewCa ...

  7. 正则匹配class并替换整个class为空

    str.replace(/class=[\"|'](.*?)[\"|'].*?/g, '')

  8. 从源码导入到github

    http://stackoverflow.com/questions/4658606/import-existing-source-code-to-github If you've got local ...

  9. Linux的文件访问权限及修改权限命令chmod

    http://www.linuxso.com/command/chmod.html Linux的文件访问权限及修改权限命令chmod Mxx000 Mxx000 人赞同了该文章 Linux的文件访问权 ...

  10. vue input框type=number 保留两位小数自定义组件

    第一步:自定义组件MyNumberInput.vue<template> <input class="numberInput" type="number ...