🚀 在 VS Code 中

改善磁碟效能

預設情況下,「開發容器」擴充功能使用「繫結掛載」來掛載本機檔案系統中的原始碼。雖然這是最簡單的選項,但在 macOS 和 Windows 上,當從容器內部執行 yarn install 等命令時,您可能會遇到較慢的磁碟效能。您可以採取一些措施來解決這些類型的問題。

將您的原始碼儲存在 Windows 上 WSL 2 檔案系統中

Windows 10 2004 及更新版本包含 Windows Subsystem for Linux (WSL 2) 的改良版本,它提供完整的 Linux 核心,並且與 WSL 1 相比,效能顯著提升。Docker Desktop 2.3+ 包含新的 WSL 2 引擎,可在 WSL 而非 VM 中執行 Docker。因此,如果您將原始碼儲存在 WSL 2 檔案系統中,您將看到效能提升,以及針對設定權限等事項的更佳相容性。

請參閱在 Windows 上於容器中開啟 WSL 2 資料夾,以取得在 VS Code 中使用此新引擎的詳細資訊。

影片:加速 Windows 上的開發容器

在容器磁碟區中使用「Clone Repository」

開發容器:在容器磁碟區中複製儲存庫... 命令使用隔離的本機 Docker 具名磁碟區,而不是繫結至本機檔案系統。除了不會污染您的檔案樹狀結構之外,本機磁碟區還具有改善 Windows 和 macOS 上效能的額外優點。

請參閱在隔離的容器磁碟區中開啟 Git 儲存庫或 GitHub PR,以取得使用此方法的詳細資訊。

接下來的兩個章節將概述如何在其他情境中使用具名磁碟區。

使用目標明確的具名磁碟區

由於 macOS 和 Windows 在 VM 中執行容器,因此「繫結」掛載不如直接使用容器的檔案系統快速。幸運的是,Docker 具有本機「具名磁碟區」的概念,它可以像容器的檔案系統一樣運作,但在容器重建後仍然存在。這使其非常適合儲存套件資料夾(如 node_modules)、資料資料夾或輸出資料夾(如 build),在這些資料夾中,寫入效能至關重要。請根據您在 devcontainer.json 中參考的內容,遵循以下適當的步驟。

Dockerfile 或映像:

讓我們使用 vscode-remote-try-node 儲存庫來說明如何加速 yarn install

請依照下列步驟執行

  1. 使用 devcontainer.json 中的 workspaceMount 屬性來告知 VS Code 將原始碼繫結到何處。然後使用 mounts 屬性 (VS Code 1.41+) 將 node_modules 子資料夾掛載到具名的本機磁碟區中。

    "mounts": [
        "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume"
    ]
    

    注意:您可以在 source 中使用 ${localWorkspaceFolderBasename}${devcontainerId} 或硬式編碼的名稱。

  2. 由於此儲存庫以非 root「node」使用者身分執行 VS Code,因此我們需要新增 postCreateCommand 以確保使用者可以存取資料夾。

    "remoteUser": "node",
    "mounts": [
        "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume"
    ],
    "postCreateCommand": "sudo chown node node_modules"
    

    如果您將以 root 身分在容器中執行,則不需要第二個步驟。

如果您已建置容器並連線到容器,請從命令面板 (F1) 執行開發容器:重建容器以選取變更。否則,請執行開發容器:在容器中開啟資料夾... 以連線到容器。

關於此方法的兩個注意事項

  1. 如果您刪除容器中的 node_modules 資料夾,它可能會失去與磁碟區的連線。請在需要時刪除 node_modules 資料夾的內容 (rm -rf node_modules/* node_modules/.*)。

  2. 您會發現使用此方法在本機建立了一個空的 node_modules 資料夾。這是因為容器中的磁碟區掛載點位於本機檔案系統繫結掛載內部。這是預期的,並且無害。

Docker Compose:

雖然 vscode-remote-try-node 未使用 Docker Compose,但步驟類似,但磁碟區掛載組態放置在不同的檔案中。

  1. 在您的 Docker Compose 檔案(或延伸檔案)中,將具名的本機磁碟區掛載新增至適當服務的 node_modules 子資料夾。例如

    version: '3'
    services:
      your-service-name-here:
        volumes:
          # Or wherever you've mounted your source code
          - .:/workspace:cached
          - try-node-node_modules:/workspace/node_modules
        # ...
    
    volumes:
      try-node-node_modules:
    
  2. 接下來,請確保 devcontainer.json 中的 workspaceFolder 屬性與您實際原始碼掛載的位置相符

    "workspaceFolder": "/workspace"
    
  3. 如果您在容器中以非 root 的使用者身分執行,請新增 postCreateCommand 以更新您掛載的資料夾的擁有者,因為它可能已掛載為 root。將 user-name-goes-here 替換為適當的使用者。

    "remoteUser": "node",
    "workspaceFolder": "/workspace",
    "postCreateCommand": "sudo chown user-name-goes-here node_modules"
    

如果您已建置容器並連線到容器,請從命令面板 (F1) 執行開發容器:重建容器以選取變更。否則,請執行開發容器:在容器中開啟資料夾... 以連線到容器。

影片:加速開發容器中的 npm 安裝

為您的整個原始碼樹狀結構使用具名磁碟區

最後,如果以上選項都無法滿足您的需求,您可以更進一步並在本機具名磁碟區內複製您的整個原始碼樹狀結構,而不是在本機。您可以設定具名磁碟區,方法是採用現有的 devcontainer.json 組態,並依如下方式修改它(使用您想要呼叫磁碟區的名稱更新 your-volume-name-here)。

取決於您在 devcontainer.json 中參考的內容

  • Dockerfile 或映像:在 devcontainer.json 中使用下列屬性,將本機具名磁碟區掛載到容器中

    "workspaceMount": "source=your-volume-name-here,target=/workspace,type=volume"
    "workspaceFolder": "/workspace",
    
  • Docker Compose:使用下列內容更新(或延伸)您的 docker-compose.yml,以用於適當的服務

    version: '3'
    services:
      your-service-name-here:
        volumes:
            - your-volume-name-here:/workspace
        # ...
    
    volumes:
      your-volume-name-here:
    

    您也會想要確保 devcontainer.json 中的 workspaceFolder 屬性與磁碟區的掛載位置(或磁碟區內的子資料夾)相符

    "workspaceFolder": "/workspace"
    

如果您已建置容器並連線到容器,請從命令面板 (F1) 執行開發容器:重建容器以選取變更。否則,請執行開發容器:在容器中開啟資料夾... 以連線到容器。

接下來,使用命令面板中的Git:Clone 命令或啟動整合式終端機 (⌃⇧` (Windows、Linux Ctrl+Shift+`)) 並使用 git clone 命令將您的原始碼複製到 /workspace 資料夾中。

最後,使用檔案 > 開啟... / 開啟資料夾... 命令在容器中開啟複製的儲存庫。