首页 > 其他 > 详细

vscode中断点调试vue实践

时间:2020-03-13 13:45:30      阅读:360      评论:0      收藏:0      [点我收藏+]

当时的想法是xxx.vue 代码里面是否打断的,或者在阅读源时,看了解某一变量的值,或者方法是否被调用

参考了 vscode中断点调试vue 但实际实践,还是有不少具体情况要注意

技术分享图片

1. VSCode(1.43)安装Debugger for Chrom插件后之后(重启),左侧有一个"虫子"的按钮图标,说明这个插件被安装成功了.点击后, 发现实际界面和文章里有差异, 搞了半天不知道到哪里设置launch.json, 这个坑蛮大的. 但VS弹出一些提示, 摸着脑袋尝试. 突然可以设置launch.json, 界面也和参考文章基本接近.

技术分享图片

第11行,改成自己的要调试的Vue项目端口

2.按F5进入调试模式,调试时会另起一个浏览器,在这个浏览器中的操作会触发断点,这个点务必注意. 调试断点最好在调试前打好, 调试中所打到断点在我实践的时,发现没效果.

技术分享图片

技术分享图片

如果断点时灰的,别忘记启用断点(上图)

技术分享图片

调试效果图(上图)

vscode中断点调试vue实践

原文:https://www.cnblogs.com/zhuji/p/12485782.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!