Redux-Devtools调试工具安装使用

1、Redux-Devtools调试工具下载
方式一:去谷歌应用商店搜索redux-devtools直接安装即可,但又一个前提条件(需要,这里不考虑);
方式二:可以去chrome插件网下载,下载地址为:http://chromecj.com/web-development/2018-03/931/download.html,下载过程需要关注公众号,发送插件即可得到验证码进行下载;
2、安装过程

  • 经过刚才的步骤,此时你得到的是一个后缀名为crx的文件,然后打开chrome浏览器,点击谷歌浏览器右上角的自定义及控制按钮,在下拉框中选择工具选项,然后点击扩展程序来启动Chrome浏览器的扩展管理器页面。
    Redux-Devtools调试工具安装使用_第1张图片
  • 在打开的谷歌浏览器的扩展管理器中用户可以看到一些已经安装程序的Chrome插件,或者一个Chrome插件也没有。
  • Redux-Devtools调试工具安装使用_第2张图片
  • 找到自己已经下载好的Chrome离线安装文件xxx.crx,然后将其从资源管理器中拖动到Chrome的扩展管理界面中。
  • 松开鼠标就可以把当前正在拖动的插件安装到谷歌浏览器中去,但是谷歌考虑用户的安全隐私,在用户松开鼠标后还会给予用户一个确认安装的提示。
  • Redux-Devtools调试工具安装使用_第3张图片
  • 用户这时候只需要点击添加按钮就可以把该离线Chrome插件安装到谷歌浏览器中去,安装成功以后该插件会立即显示在浏览器右上角(如果有插件按钮的话),如果没有插件按钮的话,用户还可以通过Chrome扩展管理器找到已经安装的插件。
  • 注意:到了这步,我猜有些小伙伴的电脑会显示文件无效字样,不用着急,我还有办法:
  • 将刚下载的.crx的chrome插件重命名为.zip压缩包
    解压刚刚重命名的压缩包
    打开chrome——>扩展程序——>加载已解压的扩展程序(确保开发者模式打开)——>选择刚刚解压的文件夹;
    如果加载失败,打开已经解压的文件夹,将里面的"_metadata"文件夹改名为"metadata"(去掉开头的下划线);

总结:正常按照以上步骤操作亲测可以完美安装和使用;但是还有一点千万不要忘了,就是要在你的项目中安装redux-devtools-extension(千万不能忘),如果安装成功了的小伙伴,帮忙点个赞吧;

你可能感兴趣的:(React)