1. 创建或修改 launch.json 配置文件
点击左侧边栏的"运行和调试"按钮(或按 Ctrl+Shift+D
),然后点击"打开 launch.json"。
2. 配置正确的浏览器路径
根据你的操作系统和浏览器,使用以下配置之一:
Windows 系统:
json
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "启动Chrome调试",
"file": "${workspaceFolder}/ch0111.html",
"runtimeExecutable": "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe",
"webRoot": "${workspaceFolder}"
}
]
}
macOS 系统:
json
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "启动Chrome调试",
"file": "${workspaceFolder}/ch0111.html",
"runtimeExecutable": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
"webRoot": "${workspaceFolder}"
}
]
}
Linux 系统:
json
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "启动Chrome调试",
"file": "${workspaceFolder}/ch0111.html",
"runtimeExecutable": "/usr/bin/google-chrome",
"webRoot": "${workspaceFolder}"
}
]
}
3. 安装必要的扩展
确保已安装 Debugger for Chrome 或 JavaScript Debugger 扩展。
4. 更好的方案:使用 Live Server
对于Vue开发,推荐使用 Live Server 扩展:
- 在扩展商店搜索并安装 "Live Server"
- 右键点击 HTML 文件
- 选择 "Open with Live Server"
这样可以避免浏览器路径配置问题,并且支持热重载。
5. 检查浏览器是否已安装
如果使用 Chrome,确认浏览器已正确安装在系统中。如果没有,可以下载安装或改用其他浏览器(如 Edge、Firefox)。
试试这些方法,应该能解决你的问题!如果还有问题,告诉我你的操作系统类型,我可以提供更具体的配置。