使用 VSCode 扩展 Debugger for Chrome 同时运行多个项目

Question

我有 2 个项目（React 项目），我希望能够在使用 VS Code 时同时进行调试。项目的启动配置如下：

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Project A",
      "url": "http://localhost:3003",
      "webRoot": "${workspaceFolder}"
    }
  ]
}

和

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Project B",
      "url": "http://localhost:3001",
      "webRoot": "${workspaceFolder}"
    }
  ]
}

如果我单独启动任何项目，则一切正常。但是，如果我尝试在另一个已经运行时启动一个，我会得到：

所以问题是，我应该如何进行设置，以便在 VS Code 中调试多个使用 Debugger for Chrome 扩展的项目？

Answer 1

我遇到了同样的问题，因为它适用于旧版本的 vscode-debgger。我打开包含两个项目的文件夹并使用如下配置运行它：

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Project A and B",
      "url": "http://localhost:3001",
      "urlFilter": "http://localhost:*",
      "pathMapping": {
           "http://localhost:3001": "${workspaceFolder}/projectA",
           "http://localhost:3003": "${workspaceFolder}/projectB"
      }
    }
  ]
}

当 Chrome 启动时，您仍然需要使用 http://localhost:3003 手动打开第二个标签。