如何在MacOS中设置VSCode + Chrome调试器+ Docker（适用于Mac的Docker）

Question

我使用Docker for Mac（版本18.06.1-ce-mac74（26766）），并且需要在VSCode中配置Google Chrome调试器。在互联网上找到的配置对我来说不起作用（https://medium.com/@drcallaway/debugging-es6-in-visual-studio-code-4444db797954的方式）。我分享了如何配置所有功能：

Answer 1

结构项目

/.vscode
  /launch.json
/admin
  /node_modules
  /public
  /src
  /package.json
/docker-compose.yaml

/。vscode / launch.json

{
  "version": "0.2.0",
  "configurations":{
    "name": "Chrome",
    "type": "chrome",
    "request": "launch",
    "url": "http://localhost:3000",
    "webRoot": "${workspaceRoot}/admin/src",
    "sourceMapPathOverrides": {
      "/srv/my-admin/src/*": "${webRoot}/*"
    },
    "runtimeArgs": [
      "--remote-debugging-port=9222"
    ]
  }
}

docker-compose.yaml

version: '3.5'

services:
  node:
    image: node:8.11.4-alpine
    working_dir: /srv
    volumes:
      - $PWD/admin:/srv/my-admin
    ports:
      - 3000:3000
      - 9222:9222
    command: yarn --cwd my-admin start

尝试和乐趣！