一、devtools调试工具下载和安装
1.1. 插件下载
访问极简插件官网搜索devtools
https://chrome.zzzmh.cn/#/index
![image.png](https://i-blog.csdnimg.cn/blog_migrate/80d996f5458b3f35d2b699cd3a1b9494.png)
1.2. 下载
![image.png](https://i-blog.csdnimg.cn/blog_migrate/bd9328db3b216b1048e83bd31d5a44d8.png)
1.3. 下载好以后,解压
1.4. 配置 Chrome 浏览器中的 vue-devtools
点击 Chrome 浏览器右上角的 按钮
,选择 更多工具 -> 扩展程序
![image.png](https://i-blog.csdnimg.cn/blog_migrate/2cba52c4f59aa09143eb56b29a3d8fa5.png)
1.5. 打开开发者模式
![image.png](https://i-blog.csdnimg.cn/blog_migrate/8ff63226d3e4bea2feb043426080718b.png)
1.6. 将插件拖动到谷歌的扩展程序页面就可以直接安装了
![image.png](https://i-blog.csdnimg.cn/blog_migrate/8cff164bee143dab513f800676e2a584.png)
二、devtools的使用
注意:只有在含有Vue的网页中才有如下选项
![image.png](https://i-blog.csdnimg.cn/blog_migrate/fd88a8fc5e70f2c9fab3661ea44404e0.png)
![image.png](https://i-blog.csdnimg.cn/blog_migrate/e079299f0817a3724e43b3c3df1f3a39.png)
![image.png](https://i-blog.csdnimg.cn/blog_migrate/87620298542695039bd41ab37391b142.png)