没有费话，直上干货了。下面配置中的文件路径与URL能够直接替换成你本地的参数。但是，对于${}变量，我推荐请不要修改。 为了享受VSC IDE的调试方便，下面的三个Extensions是需要被预先安装到你本地的VSC上的：

1. Debugger for Chrome
2. Debugger for Firefox
3. Debugger for Edge
4. 很可惜，社区里没有提供Debugger for IE。

然后，在工作区的.vscode/launch.json文件里，做一点很简单的配置（见如下）就全部搞定了。打开VSC的Debug View，点击Play按扭开始调试程序了。VSC会自行启动一个浏览器实例并进入“调试”模式。

Debugger for Chrome的.vscode/launch.json文件配置例程

{
  "version": "0.2.0",
  "configurations": [{
      "type": "chrome",
      "request": "launch",
      "name": "Chrome localhost",
      "url": "http://192.168.1.100:8887/${relativeFile}",
      "runtimeExecutable": "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe",
      "runtimeArgs": ["--remote-debugging-port=9222"],
      "userDataDir": "${workspaceRoot}/.vscode/chrome",
      "webRoot": "${workspaceRoot}"
    }]
}

Debugger for Firefox的.vscode/launch.json配置例程

{
  "version": "0.2.0",
  "configurations": [{
    "type": "firefox",
    "request": "launch",
    "name": "learning-three.js firefox",
    "url": "http://192.168.1.100:8887/${relativeFile}",
    "webRoot": "${fileDirname}",
    "pathMappings": [{
      "url": "http://192.168.1.100:8887",
      "path": "${workspaceRoot}"
    }],
	"profile": "default",
    "firefoxExecutable": "G:/Program Files/Mozilla Firefox/firefox.exe",
    "firefoxArgs": ["-start-debugger-server", "-no-remote"],
    "log": {
      "consoleLevel": {
        "PathConversion": "Warn",
        "default": "Warn"
      }
    }
    }]
}

Debugger for Edge的.vscode/launch.json文件配置例程

{
  "version": "0.2.0",
  "configurations": [{
    "type": "edge",
    "request": "launch",
    "name": "learning-three.js edge",
    "url": "http://192.168.1.100:8887/${relativeFile}",
    "webRoot": "${fileDirname}"
    }]
}