react项目安装redux-devtools插件方法教程,亲测有效。

react项目用到redux。使用redux-devtools工具可以在谷歌Chrome浏览器方便的查看项目的信息。

看到别人文章各种安装太麻烦,主要是插件难下载。于是亲自安装一下。

(我把插件保存在网盘里面:永久有效:

百度网盘:链接: https://pan.baidu.com/s/1Yc5_nTQuMv0DsJQmwibOtw

提取码: jqnf             复制这段内容后打开百度网盘手机App,操作更方便哦)工具界面效果是这样。

和vue-devtools有点像。

安装方法如下。

下载网盘里面的文件解压到你新建的一个文件夹里面。

重点:插件名:Redux DevTools_v2.17.0.crx

打开谷歌浏览器的插件扩展安装页面:chrome://extensions/

 然后把这个插件从文件夹直接拖动到谷歌浏览器插件安装页面就可以,按照提示点击安装即可很方便。

 安装完成。

点击一下浏览器右上角插件小图标。把安装好的插件固定到浏览器上方便使用。然后打开react项目点击一个这个绿色红点圆环图标就能看到redux-devtools的工具界面了。

在项目中不需要额外安装插件。

引入store的时候,需要判断一下是否安装了redux-devtools插件。有就用没有就不用,这样不影响别人。(window.__REDUX_DEVTOOLS_EXTENSION__ || window.__REDUX_DEVTOOLS_EXTENSION__)

如下:

 完美。亲测有效。

本文章参考了以下文章。

使用Redux DevTools浏览器插件调试redux_applebomb的专栏-CSDN博客


版权声明:本文为qq_42780323原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。