vue前端调试,vue的调试工具
本文主要介绍了Vue提供的三种调试方法，具有一定的参考价值。感兴趣的朋友可以参考一下，希望能帮到你。
目录
一、在VS代码二中配置调试。调试器语句III。Vue开发工具概述
一、在 VS Code 中配置调试
使用Vue CLI 2构建项目时：
更新config/index.js中的devtool属性：
devtool:源地图，
单击活动栏中的调试器图标，进入调试视图：
选择chrome/Firefox:启动环境。将launch.json的内容替换为：
{
版本: 0.2.0 ，
配置:[
{
类型:铬，
请求:启动，
名称: vuejs: chrome ，
url: http://localhost:8080 ，
webRoot : $ { workspace folder }/src ，
breakOnLoad: true，
sourceMapPathOverrides :
web pack:///src/* $ { webRoot }/*
}
},
{
键入: firefox ，
请求:启动，
名称: vuejs: firefox ，
url: http://localhost:8080 ，
webRoot : $ { workspace folder }/src ，
path mappings :[{ URL : web pack:///src/， path: ${webRoot}/ }]
}
]
}
开始调试：
设置断点：
#开始项目
npm运行开发
在调试页面上选择“vuejs:chrome ”:
二、debugger语句
推荐
function potentially buggy code(){
调试器
//做一些可能会出错的事情来检查、单步执行等。
}
浏览器：F12打开DevTools，运行程序后会停在debbger语句：
注意：安装Eslint插件后，单击快速修复，禁用该行的无调试器。否则，保存时将自动清除调试器语句。
三、Vue Devtools
谷歌浏览器的插件。
详情见官方链接：https://cn.vuejs.org/v2/cookbook/debugging-in-vscode.html # vue-dev tools
总结
本文到此为止。希望能帮到你，也希望你能多关注我们的更多内容！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。