在打开的Chorme中进行调试为例(这样不用每次启动调试就打开Chorme)
- 下载Debugger for Chorme
- 对Chorme启动设置参数
Google Chorme 右键属性-快捷方式-目标-在尾部添加" --remote-debugging-port=9222"(注意--前面有空格)
- 在vscode配置launch.json文件
比如调试的网址为“http://localhost:8080/Default.html ”,
type设置为chorme
request设置为attach
{
"version": "0.2.0",
"configurations": [
{
"type": "
chrome",
"request": "
attach",
"name": "Attach chorme",
"url": "http://localhost:8080/Default.html",
"port": 9222,
"webRoot": "${workspaceRoot}"
}
]
}
- 重新打开Chorm
打开网址http://localhost:8080/Default.html
- 设置断点调试
左边栏的Local可以自动显示变量,调试中也可以鼠标悬停显示