/** * 一些参考链接: * https://containers.dev/implementors/json_reference/#variables-in-devcontainerjson * https://code.claude.com/docs/zh-CN/devcontainer * https://github.com/Kilo-Org/kilocode/blob/main/cli/Dockerfile */ { "name": "SBX", "forwardPorts": [ 4730, 4731 ], // vscode://settings/remote.localPortHost -> 默认只监听 localhost "portsAttributes": { "4730": { "label": "开发服务器端口", "onAutoForward": "notify" }, "4731": { "label": "预览服务器端口", "onAutoForward": "notify" } }, "build": { "dockerfile": "Dockerfile", "args": { // } }, "runArgs": [ // ----- // "--network=host", // "--add-host=myservice.local:127.0.0.1", // ----- // "--env-file", // ".devcontainer/.env", // ----- "--cap-add=NET_ADMIN", "--cap-add=NET_RAW", "--add-host=host.docker.internal:host-gateway", "--name=${localWorkspaceFolderBasename}-devcontainer" ], "customizations": { "vscode": { "extensions": [ // AI "anthropic.claude-code", "google.gemini-cli-vscode-ide-companion", "kilocode.kilo-code", "alibaba-cloud.tongyi-lingma", // >>>>> "vue.volar", "lokalise.i18n-ally", "eamodio.gitlens", "vitest.explorer", "antfu.unocss", // <<<<< // 代码质量 / 格式化 / Lint "editorconfig.editorconfig", "dbaeumer.vscode-eslint", "stylelint.vscode-stylelint", "oxc.oxc-vscode", "esbenp.prettier-vscode" ], "settings": { "editor.formatOnSave": true, "editor.defaultFormatter": "esbenp.prettier-vscode", "editor.codeActionsOnSave": { "source.fixAll.eslint": "explicit" }, "terminal.integrated.defaultProfile.linux": "zsh", "terminal.integrated.profiles.linux": { "🐚bash": { "path": "bash", "icon": "terminal-bash" }, "💲zsh": { "path": "zsh", "icon": "terminal-cmd", "overrideName": true } }, // https://stackoverflow.com/questions/75708866/vscode-dev-container-fails-to-load-ms-vscode-js-debug-extension-correctly // https://davidwesst.com/blog/missing-bootloader-in-vscode-devcontainer/ /** * autoAttachFilter 存在问题:会在 NODE_OPTIONS 中注入 bootloader.js 的 --require 参数, * 并错误地重复拼接 --max-old-space-size,形成类似: * NODE_OPTIONS= --require /home/.../bootloader.js --max-old-space-size=4096--max-old-space-size=4096 * 导致启动时报错: * Error: illegal value for flag --max-old-space-size=4096--max-old-space-size=4096 of type size_t * 将其设置为 "disabled" 以规避该问题。 */ "debug.javascript.autoAttachFilter": "disabled" } } }, "containerEnv": { // "CLAUDE_CONFIG_DIR": "/home/usr_vscode/.claude", "ANTHROPIC_AUTH_TOKEN": "${localEnv:ANTHROPIC_AUTH_TOKEN}", "ANTHROPIC_BASE_URL": "${localEnv:ANTHROPIC_BASE_URL}", "GEMINI_API_KEY": "${localEnv:GEMINI_API_KEY}", "GOOGLE_GEMINI_BASE_URL": "${localEnv:GOOGLE_GEMINI_BASE_URL}", "NODE_OPTIONS": "--max-old-space-size=4096", "CLAUDE_CONFIG_DIR": "/home/usr_vscode/.claude", "DEVCONTAINER": "true", // https://github.com/anthropics/claude-code/blob/1fe9e369a7c30805189cbbb72eb69c15ed4ec96b/.devcontainer/Dockerfile#L42 "SANDBOX": "sandbox-devcontainer", // gemini 显示这个。 "TZ": "${localEnv:TZ:Asia/Shanghai}" }, "remoteUser": "usr_vscode", "mounts": [ "source=${localWorkspaceFolderBasename}---bashhistory,target=/commandhistory,type=volume", "source=${localWorkspaceFolderBasename}---iflow,target=/home/usr_vscode/.iflow,type=volume", "source=${localWorkspaceFolderBasename}---gemini,target=/home/usr_vscode/.gemini,type=volume", "source=${localWorkspaceFolderBasename}---claude-code-router,target=/home/usr_vscode/.claude-code-router,type=volume", "source=${localWorkspaceFolderBasename}---claude-code,target=/home/usr_vscode/.claude,type=volume", "source=${localWorkspaceFolderBasename}---pnpm-store,target=/home/usr_vscode/.pnpm-store,type=volume", "source=${localWorkspaceFolderBasename}---node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume" ], /** * 执行顺序总结 1. initializeCommand (本地主机) 2. 容器创建 3. onCreateCommand (容器内,仅首次) 4. updateContentCommand (容器内) 5. postCreateCommand (容器内) 6. 容器启动 7. postStartCommand (容器内,每次启动) 8. VS Code 附加到容器 9. postAttachCommand (容器内,每次附加) */ "initializeCommand": /* 本地执行(容器创建前) */ "echo '准备创建容器...'", "onCreateCommand": /* 容器内执行(仅首次创建) */ { "setup-node": "pnpm env use lts --global", "fix-claude-code-router": "sudo chown -R usr_vscode /home/usr_vscode/.claude-code-router", "fix-claude": "sudo chown -R usr_vscode /home/usr_vscode/.claude", "fix-gemini": "sudo chown -R usr_vscode /home/usr_vscode/.gemini", "fix-node_modules": "sudo chown usr_vscode node_modules" }, "updateContentCommand": /* 容器内执行(创建后或内容更新) */ "pnpm install", "postCreateCommand": /* 容器内执行(创建完成后) */ { "install-global-cli": "pnpm install -g @google/gemini-cli@latest @anthropic-ai/claude-code@latest @musistudio/claude-code-router@latest @iflow-ai/iflow-cli@latest" }, "postStartCommand": /* 容器内执行(每次启动) */ "echo '容器已启动!'", "postAttachCommand": /* 容器内执行(每次附加) */ "echo '开发环境已就绪!${containerWorkspaceFolder}'", // "updateRemoteUserUID": true, "waitFor": "updateContentCommand", "workspaceMount": "source=${localWorkspaceFolder},target=/${localWorkspaceFolderBasename},type=bind,consistency=delegated", "workspaceFolder": "/${localWorkspaceFolderBasename}" }