使用vue-cli的同学肯定知道有一个基于Chrome(内核浏览器)的一个调试工具——vue-devtool。但是在国内环境很难直接在Chrome商店下载得到(对于有条件的童鞋可以使用,PS:具体请脑补)。今天提供一个4.1.5版本的下载地址。 可以到csdn下载。附上链接: link.
1:我们打开chrome的扩展程序,讲刚下载的文件拖进去,就可以安装了
2:更改一些配置
首先打开chrome的开发者模式,然后允许vue-devtool在隐身模式使用,和允许访问网址。
改好之后,还需要修改插件的一个配置,找到插件的安装目录,在chrome浏览器输入:chrome:version 会出现下面显示的信息,并找到个人资料路径
找到安装目录之后,可以看到有个manifest.json文件。打开我们修改几个地方。
3:最后使用
使用vue-devtool可以查看vue组件里面的data里面的变量,methods里面的函数,和一些全局对象比如说:|'$refs,$route'
,可以查看vuex里面的变量及变化监听。