一、vue.js插件下载
二、Vue开发工具vuejs-devtools下载
三、Vue开发工具vuejs-devtools安装+使用
根据下图打开谷歌浏览器中的【拓展程序】:
勾选【开发者模式】——点击【加载已解压的拓展程序】——选择刚刚解压的vuejs-devtools插件整个文件夹导入即可。导入后即可看到一件导入的vuejs-devtools插件。
用谷歌打开文件进入调试模式(按F12即可进入),即可在调试控制台看到vue页签。如下图:
四、常见问题解决
安装好插件后,打开文件并打开调试模式后没有vue页签,这可很常见,解决方法如下:
方法一:最常见的是我们引入vue插件时引入了生产版本(vue.main.js)也就是压缩后的版本,这个默认是关闭,需要在你的js文件中的创建vue前面写入:Vue.config.devtools = true;即可(不是在vue.main.js写这句话)。
方法二:导入Vue插件是我们选择开发版本的插件(vue.js)这样就不存在上诉的问题了。