不需要安装谷歌插件，使用使用IDEA自带的插件debug调试vue前端代码

---

前言

---

一、IDEA设置Edit Configuration

点击启动下拉框，点击Edit Configuration

弹出对话框后，点击+号，再选择JavaScript Debug，URL输入项目调试地址，浏览器建议选择默认的Chrome

配置完成，然后启动会弹出Chrome页面，点击添加断点，就可以愉快地调试了

二、IDEA调试快捷键

单步调试等快捷键操作还是IDEA的快捷键：
1、F8 单步调试，不进入函数内部
2、F7 单步调试，进入函数内部
3、Shift+F7 选择要进入的函数
4、Shift+F8 跳出函数
5、Alt+F9 运行到断点
6、Alt+F8 执行表达式查看结果
7、F9 继续执行，进入下一个断点或执行完程序
8、Ctrl+F8 设置/取消当前行断点
9、Ctrl+Shift+F8 查看断点