1、安装Debugger for Chrome
2、设置配置,url为Vue的npm中配置的地址,launch.json文件
注意在调试VUE项目或者有代理的项目时,localhost可能需要调整为:127.0.0.1,否则可能匹配不上
{
// 使用 IntelliSense 了解相关属性。
// 悬停以查看现有属性的描述。
// 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:8020",
"webRoot": "${workspaceFolder}"
}
]
}
devServer:{
proxy:{
'/proxy_api': {
target: "http://test.api.com:8080",
changeOrigin: true,
pathRewrite: {
['^' + '/proxy_api']: ''
}
},
}
}
3、npm run dev
4、对以.js或.ts文件中的js,直接打断点,对在html中的js,可以在要调试的js代码前加debugger
5、调试->开始调试,会启用chrome浏览器。
sequelize插件:vscode中js代码提示功能
参考:https://www.cnblogs.com/wangz8480/p/16469545.html
安装插件【JavaScript Debugger】和【Open in Browser】
其中【JavaScript Debugger】集成了原【Debug for Chrome】
插件【Open in Browser】安装后html文件右键菜单显示【Open In Default Browser】和【Open In Other Browser】
配置.html文件,在文件中引入.js文件
引用方式:使用<script>标签
html文件内,右键菜单选择【Open In Default Browser】
如果想浏览器实时反馈文件修改,选择【Open with Live Server】
浏览器界面:查看html标签和布局
浏览器【开发者工具】-【Console】:查看 console.log() 输出
浏览器弹窗:查看 window.alert() 输出