react devtools用于调试react代码，可以查看到props、state的值，以及定义的hooks，而redux devtools可以追踪到action的派发、store的变化，两个都是react开发过程中非常好用的工具

下面是附上两个开发者工具下载地址

react devtools

链接：https://pan.baidu.com/s/1gLF1Bw9vn6CRiWnFayfJYA 提取码：shsk

redux devtools

链接：https://pan.baidu.com/s/1FI7RU3vQ1raEXpmQ-fwXUA  提取码：in0n

下载文件后解压

打开拓展程序，选择 加载已解压的拓展程序，导入上面的文件夹

导入文件夹后就可以在拓展程序里看到 react 和redux的开发者工具

点击右上角的用户旁类似于 拼图 的按钮，将react、redux开发者工具固定在导航栏处，如果该页面使用了react / redux，对应的图标会变亮，生产环境和开发环境亮的颜色不一样，如果没有使用则置灰

然后通过 ctrl + shift + i，检查/审查元素，当该页面有使用react / redux 时，才能找到 react / redux 的开发者工具，选择即可进行相关的调试

以上就是react/redux的开发者工具安装步骤

​

chrome浏览器插件react devtools、redux devtools，无需安装、解压即可用的更多相关文章

  1. 使用 Chrome 浏览器插件 Web Scraper 10分钟轻松实现网页数据的爬取

    web scraper 下载:Web-Scraper_v0.2.0.10 使用 Chrome 浏览器插件 Web Scraper 可以轻松实现网页数据的爬取,不写代码,鼠标操作,点哪爬哪,还不用考虑爬 ...

  2. 还在为百度网盘下载速度太慢烦恼?chrome浏览器插件帮你解决！

    百度网盘已然成为分享型网盘中一家独大的“大佬”了.时代就是这样不管你喜不喜欢,上网总会遇到些百度网盘共享的文件需要下载.然而,百度网盘对免费用户的限速已经到了“感人”的地步了,常常十多KB/秒的速度真 ...

  3. chrome浏览器插件启动本地应用程序

    chrome浏览器插件启动本地应用程序 2014-04-20 00:04:30|  分类: 浏览器插件|举报|字号 订阅     下载LOFTER我的照片书  |     chrome的插件开发这里就 ...

  4. Rest Client(Rest接口调试工具，有保存功配置功能) chrome浏览器插件

    Rest Client(Rest接口调试工具,有保存功配置功能) chrome浏览器插件 下载地址 插件的操作很简单,下面是一些简单的实例. 1.安装 在谷歌应用商城搜索postman,如下图1-1所 ...

  5. chrome浏览器插件window resizer调试webapp页面大小

    chrome浏览器插件window resizer可以调整当前浏览器分辨率大小 可以自定义大小,以适合于andorid和iphone设备

  6. 用Javascript编写Chrome浏览器插件

    原文:http://homepage.yesky.com/62/11206062.shtml 用Javascript编写Chrome浏览器插件 2010-04-12 07:30 来源:天极网软件频道 ...

  7. chrome浏览器插件开发经验（一）

    最近在进行chrome浏览器插件的开发,一些小的经验总结随笔. 1.首先,推荐360的chrome插件开发文档:http://open.chrome.360.cn/extension_dev/over ...

  8. 强烈推荐 10 款珍藏的 Chrome 浏览器插件

    Firebug 的年代,我是火狐(Mozilla Firefox)浏览器的死忠:但后来不知道为什么,该插件停止了开发,导致我不得不寻求一个新的网页开发工具.那段时间,不少人开始推荐 Chrome 浏览 ...

  9. 《React 与 Redux 开发实例精解》出版了！

    <React 与 Redux 开发实例精解>出版了! <React 与 Redux 开发实例精解>出版了! 关于 React 与 Redux React 与 Redux, 一个 ...

  10. nodejs + webpack4 + babel6 结合写Chrome浏览器插件记录

    最近任务不忙,有时间了看一下Chrome插件相关的东西,于是想用nodejs + webpack写一个能直出插件的小工具. 1.nodejs + babel6 + webpack4 在写之前,是有把它 ...

随机推荐

  1. 张量（Tensor）、标量（scalar）、向量（vector）、矩阵（matrix）

    张量(Tensor):Tensor = multi-dimensional array of numbers 张量是一个多维数组,它是标量,向量,矩阵的高维扩展 ,是一个数据容器,张量是矩阵向任意维度 ...

  2. 2022-09-09：给定一个正整数 n，返回 连续正整数满足所有数字之和为 n 的组数 。 示例 1: 输入: n = 5 输出: 2 解释: 5 = 2 + 3，共有两组连续整数([5],[2,

    2022-09-09:给定一个正整数 n,返回 连续正整数满足所有数字之和为 n 的组数 . 示例 1: 输入: n = 5 输出: 2 解释: 5 = 2 + 3,共有两组连续整数([5],[2,3 ...

  3. IntelliJ IDEA上手这一篇就够了，从入门到上瘾

    前言 每次换电脑,最最最头疼的事情莫过于安装各种软件和搭建开发环境.这算是不想换电脑的一个原因吧(最主要还是穷).除非是电脑坏了开不了机或者点一下卡一下,真不想换电脑.每次换电脑都得折腾好久. 趁着这 ...

  4. 【编程日记】搭建python开发环境

    0.相关确定 0.1确定操作系统 Python是一种跨平台的编程语言,这意味着它能够运行在所有主要的操作系统中.然而,在不同的操作系统(Windows/Mac/Linux)中,安装Python的方法存 ...

  5. SLAM系统--开启摄像头连接

    博客地址:https://www.cnblogs.com/zylyehuo/ 基于ORB-SLAM3库搭建SLAM系统详见之前的博客 基于ORB-SLAM3库搭建SLAM系统 - zylyehuo - ...

  6. odoo开发教程四：onchange、唯一性约束

    一:onchange机制[onchange=前端js函数!可以实现前端实时更新以及修改验证] onchange机制:不需要保存数据到数据库就可以实时更新用户界面上的显示. @api.onchange( ...

  7. AI 协助办公 ｜记一次用 GPT-4 写一个消息同步 App

    GPT-4 最近风头正劲,作为 NebulaGraph 的研发人员的我自然是跟进新技术步伐.恰好,现在有一个将 Slack channel 消息同步到其他 IM 的需求,看看 GPT-4 能不能帮我完 ...

  8. element-ui Tabs 标签页刷新页面状态不丢失

    element-ui Tabs 标签页刷新页面状态不丢失 转载请表明出处 https://www.cnblogs.com/niexianda/p/14765111.html 效果 一般在使用Tabs组 ...

  9. Python正则表达式完全指南

    本篇文章将深入探讨python的一项强大工具:正则表达式.正则表达式是一个强大的文本处理工具,可以用来匹配,搜索,替换和解析文本.我们将逐步展示如何在Python中使用正则表达式,包括其基本语法,常见 ...

  10. 【HarmonyOS】一文教你如何在低代码项目中跳转H5页面

    ​ [关键字] 元服务.低代码.H5页面跳转.WebView [1.写在前面] 今天我们来实现一个在低代码项目中通过按钮跳转到H5页面的功能,本项目是基于API6的JS工程,我们的实现思路是在页面B中 ...