chrome浏览器插件react devtools、redux devtools,无需安装、解压便可用

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

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

react devtools 
连接:https://pan.baidu.com/s/1gLF1Bw9vn6CRiWnFayfJYA 提取码:shsk
redux devtools
连接:https://pan.baidu.com/s/1FI7RU3vQ1raEXpmQ-fwXUA  提取码:in0n

下载文件后解压
工具

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

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

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

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

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

相关文章
相关标签/搜索