🚀 取得 ！

連接多個容器

目前，每個 Visual Studio Code 視窗只能連接到一個容器。但是，您可以啟動多個 VS Code 視窗來連接到它們。

如果您偏好使用 devcontainer.json，並且正在使用 Docker Compose，您可以為來源樹狀結構中的每個服務建立個別的 devcontainer.json 檔案，每個檔案都指向一個共用的 docker-compose.yml。

若要了解其運作方式，請參考此範例來源樹狀結構

📁 project-root
    📁 .git
    📁 .devcontainer
      📁 python-container
        📄 devcontainer.json
      📁 node-container
        📄 devcontainer.json
    📁 python-src
        📄 hello.py
    📁 node-src
        📄 hello.js
    📄 docker-compose.yml

.git 資料夾的位置很重要，因為我們需要確保容器可以看到此路徑，才能使原始碼控制正常運作。

接下來，假設根目錄中的 docker-compose.yml 如下所示

services:
  python-api:
    image: mcr.microsoft.com/devcontainers/python:1-3.12-bookworm
    volumes:
      # Mount the root folder that contains .git
      - .:/workspace
    command: sleep infinity
    # ...

  node-app:
    image: mcr.microsoft.com/devcontainers/typescript-node:1-20-bookworm
    volumes:
      # Mount the root folder that contains .git
      - .:/workspace
    command: sleep infinity
    # ...

接著，您可以如下設定 ./devcontainer/python-container/devcontainer.json 以進行 Python 開發

{
  "name": "Python Container",
  "dockerComposeFile": ["../../docker-compose.yml"],
  "service": "python-api",
  "shutdownAction": "none",
  "workspaceFolder": "/workspace/python-src"
}

接下來，您可以透過變更 workspaceFolder 來設定 ./devcontainer/node-container/devcontainer.json 以進行 Node.js 開發。

{
  "name": "Node Container",
  "dockerComposeFile": ["../../docker-compose.yml"],
  "service": "node-app",
  "shutdownAction": "none",
  "workspaceFolder": "/workspace/node-src"
}

devcontainer.json 檔案中的 "shutdownAction": "none" 是選用的，但會在 VS Code 關閉時讓容器保持執行 -- 這可防止您因關閉一個視窗而意外關閉兩個容器。

在多個 VS Code 視窗中連接多個容器

  1. 在專案的根目錄層級開啟 VS Code 視窗。
  2. 從命令選擇區 (F1) 執行「開發容器：在容器中重新開啟」，然後選取「Python Container」。
  3. VS Code 接著會啟動兩個容器、重新載入目前的視窗，並連接到選取的容器。
  4. 接下來，使用「檔案」 > 「新增視窗」開啟新視窗。
  5. 在目前的視窗中，於根目錄層級開啟您的專案。
  6. 從命令選擇區 (F1) 執行「開發容器：在容器中重新開啟」，然後選取「Node Container」。
  7. 目前的 VS Code 視窗將會重新載入並連接到選取的容器。

現在您可以從不同的視窗與兩個容器互動。

在單一 VS Code 視窗中連接多個容器

  1. 在專案的根目錄層級開啟 VS Code 視窗。
  2. 從命令選擇區 (F1) 執行「開發容器：在容器中重新開啟」，然後選取「Python Container」。
  3. VS Code 接著會啟動兩個容器、重新載入目前的視窗，並連接到選取的容器。
  4. 從命令選擇區 (F1) 執行「開發容器：切換容器」，然後選取「Node Container」。
  5. 目前的 VS Code 視窗將會重新載入並連接到選取的容器。
  6. 您可以使用相同的命令切換回去。

連接至兩個容器時擴充 Docker Compose 檔案

如果您想要擴充您的 Docker Compose 檔案以進行開發，您應該使用單一個 docker-compose.yml，其擴充兩個服務 (視需要而定)，並在兩個 devcontainer.json 檔案中參考。

例如，請參考此 docker-compose.devcontainer.yml 檔案

services:
  python-api:
    volumes:
      - ~:~/local-home-folder # Additional bind mount
    # ...

  node-app:
    volumes:
      - ~/some-folder:~/some-folder # Additional bind mount
    # ...

這兩個 .devcontainer.json 檔案都會如下更新

"dockerComposeFile": [
  "../../docker-compose.yml",
  "../../docker-compose.devcontainer.yml",
]

這個組合檔案清單會在啟動容器時使用，因此在每個 devcontainer.json 中參考不同的檔案可能會產生非預期的結果。

04/03/2025