| 1.安装插件[针对浏览器] 这里为Chrome. 输入debugger for chrome, 点击安装即可. [网络方面可能需要能访问外网] 
2.配置 .vscode/launch.json文件 要使用 vscode 的调试功能，首先就得配置 .vscode/launch.json 文件 配置参考格式如下: [下面是例子] 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
{
"version": "0.1.0",
"configurations": [
{
"name": "Launch localhost",
"type": "chrome",
"request": "launch",
"url": "http://localhost/mypage.html",
"webRoot": "${workspaceFolder}/wwwroot"
},
{
"name": "Launch index.html",
"type": "chrome",
"request": "launch",
"file": "${workspaceFolder}/index.html"
},
]
}
这里实验为:
{
// 使用 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:8001/front-end/mypage.html",
"webRoot": "${workspaceFolder}"
}
]
}
实验项目: 
使用PHP自带的web server 
备注: 如果没有launch.json 创建一个即可[参考如下] 
3. 开始调试 启动调试配置, 这里选择 'Launch Chrome against localhost' 
打上断点, 在test.js打上断点 
点击RUN即可, 会自动打开Chrome开始调试模式. 
Chrome阻塞中... 
效果如上, 更多使用另行实践. |
