Aibd Devcontainer

🚀 AIBD 開發容器

這是一個基於 VS Code Dev Containers 的預配置開發環境，集成了 模型上下文協議 (MCP) 服務器，可用於 Claude 協助開發的文件系統和 Shell 操作。

🚀 快速開始

此倉庫提供了一個現成的開發容器，具有以下功能：

• 創建一致且隔離的開發環境。
• 與 Claude Desktop 無縫集成，通過 MCP 服務器進行連接。
• 使用 Docker 卷實現持久化存儲。
• 支持 Windows（需 WSL2）、macOS 和 Linux 系統。

✨ 主要特性

• 環境一致性：藉助 VS Code Dev Containers 創建統一且隔離的開發環境，避免環境差異帶來的問題。
• 集成 Claude：與 Claude Desktop 無縫集成，通過 MCP 服務器連接，方便進行開發輔助。
• 持久化存儲：使用 Docker 卷實現持久化存儲，確保項目文件不會丟失。
• 多系統支持：支持 Windows（需 WSL2）、macOS 和 Linux 系統。

📦 安裝指南

先決條件

• Visual Studio Code
• VS Code 的 遠程容器擴展
• Docker Desktop
• Windows 用戶需啟用 WSL2

安裝步驟

1. 克隆倉庫

git clone https://github.com/gergelyszerovay/aibd-devcontainer.git
cd aibd-devcontainer

2. 在 VS Code 中打開

在終端中打開克隆後的倉庫，VS Code 會提示是否重新打開文件夾到容器中。點擊“重新打開容器”繼續。

或者，您也可以：

1. 點擊 VS Code 左下角的綠色按鈕。
2. 在菜單中選擇“重新打開容器”。

3. 等待容器構建完成

VS Code 會構建並啟動開發容器。首次運行時可能需要幾分鐘，後續啟動會更快。

4. 訪問項目文件

容器在 /volume 目錄下掛載了一個 Docker 卷：

cd volume

您可以在此目錄中進行以下操作：

• 克隆現有倉庫：git clone https://github.com/your-username/your-project.git
• 直接在此目錄創建新文件

5. 將 Claude 連接到容器

要將 Claude 連接到開發容器，可按以下步驟操作：

1. 配置 Claude Desktop 使用 MCP 服務器，將以下內容添加到 claude_desktop_config.json 文件中：

{
  "mcpServers": {
    "devcontainer": {
      "command": "npx",
      "args": ["-y", "supergateway", "--sse", "http://localhost:3100/sse"]
    }
  }
}

2. 重啟 Claude Desktop 以建立連接。

🔧 技術細節

容器配置

Dev Container JSON 配置

.devcontainer/devcontainer.json 文件定義了開發容器的配置：

{
  "name": "Node.js & TypeScript",
  "image": "mcr.microsoft.com/devcontainers/typescript-node:1-22-bookworm",
  "forwardPorts": [3100],
  "postCreateCommand": "bash .devcontainer/install.sh",
  "postStartCommand": "bash .devcontainer/start.sh",
  "mounts": [
    "source=${localWorkspaceFolderBasename}-volume,target=${containerWorkspaceFolder}/volume,type=volume"
  ]
}

此配置的具體作用如下：

• 使用官方 Microsoft TypeScript/Node.js 鏡像。
• 前向開放 3100 端口用於 MCP 服務器。
• 在容器創建後和每次啟動時運行設置腳本。
• 創建持久 Docker 卷用於存儲項目文件。

安裝腳本

.devcontainer/install.sh 腳本在容器首次創建時運行：

#/bin/sh

sudo chown -R $USER:$GROUPS /volume

該腳本確保 /volume 目錄擁有正確的用戶權限。

啟動腳本

.devcontainer/start.sh 腳本在每次啟動時運行：

#!/bin/bash

npm install -g typescript@latest ts-node@latest

此腳本用於安裝最新的 TypeScript 和 ts-node 工具鏈。

⚠️ 注意事項

⚠️ 重要提示

容器內部的 Node.js 和 npm 版本由鏡像決定，如需自定義請修改鏡像配置。

💡 使用建議

建議在首次啟動後運行 npm install 以確保項目依賴正確加載。