步骤:
- 先要安装 Debugger for Chrome 插件;
- 配置调试模式 launch.json;
- 需要注意的是,启动本地服务器再调试的话,需要先安装配置 browser-sync;
{ // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { // 直接调试相应的 html 文件 // 本地文件调试要用 file 而不能用 url // 本地文件调试不需要 webroot "name": "Launch Chrome against local file", "type": "chrome", "request": "launch", "file": "${workspaceRoot}/index.html", "runtimeArgs": [ // 允许请求本地文件 "--allow-file-access-from-files", ] }, { // 启动本地服务再调试相应的 html 文件 // 需要先终端 browser-sync star --server // 然后再运行 debug // url 地址就是 browser-sync 的地址 "name": "Launch Chrome against localhost", "type": "chrome", "request": "launch", "url": "http://localhost:3000", "webRoot": "${workspaceFolder}" } ] }