VSCode Dev Containers 通过容器化实现开发环境隔离与复用。需安装 Docker、VSCode 及官方扩展；可选模板自动生成 devcontainer.json；支持镜像替换、工具安装、目录挂载、端口转发；配置提交 Git 即可团队共享，确保环境一致。
VSCode Dev Containers 让你把整个开发环境打包进容器，代码在容器里运行、调试、依赖全隔离，本地只留编辑器——真正“所见即所得”的云原生开发体验。
一、基础准备：装好工具，拉通链路
确保本地已安装 Docker（引擎必须运行）和 VSCode（推荐最新稳定版）。再装上官方扩展 Dev Containers（Microsoft 出品，认准作者名）。不需要手动写 Dockerfile 也能起步：VSCode 提供大量预配置的 devcontainer.json 模板（比如 Node.js、Python、Go），一键生成即可用。
二、快速启动：从模板开箱即用
打开你的项目文件夹 → 按 Ctrl+Shift+P（Win/Linux）或 Cmd+Shift+P（Mac）→ 输入 Dev Container: Add Development Container Configuration Files → 选择语言/框架模板 → VSCode 自动创建 .devcontainer/ 目录，含 devcontainer.json 和可选的 Dockerfile。
- devcontainer.json 定义容器行为：镜像来源、端口转发、扩展自动安装、启动命令等
- 默认使用托管镜像（如
mcr.microsoft.com/vscode/devcontainers/node:18），省去自己维护基础镜像的麻烦 - 点右下角绿色按钮 Reopen in Container，VSCode 自动构建、启动容器，并重连工作区
三、深度定制：按需调整开发环境
常见定制场景直接改 devcontainer.json 即可：
MovingBoxes实现汽车图片展示，键盘方向键（ ← → ）也可以操作左右切换，兼容主流浏览器。 使用方法： 1. head区域引用文件 lrtk.css，jquery.js，jquery.movingboxes.js 2. head区域引用插件设置代码 3. 在你的文件中加入区域代码
-
换基础镜像：改
"image"字段，或用"build": { "dockerfile": "Dockerfile" }指向自定义构建逻辑 -
装额外工具：在
"features"中添加微软官方特性（如"ghcr.io/devcontainers/features/git:1"），免写 apt/yum 命令 -
挂载本地目录：通过
"mounts"字段绑定宿主机路径（如数据库数据卷、配置文件），避免容器重启丢数据 -
端口转发：设
"forwardPorts"后，本地浏览器访问localhost:3000就能直连容器内服务
四、协作与复用：一次配置，多人开箱
把 .devcontainer/ 提交到 Git，团队成员克隆代码后只需点击 Reopen in Container，就能获得完全一致的环境——没有“在我机器上是好的”问题。还可把常用配置发布为 dev container definition（GitHub 上已有大量开源模板），或基于它衍生私有模板，统一公司级开发标准。
基本上就这些。不复杂但容易忽略的是：容器内 PATH、shell 配置、Git 用户信息最好也在 devcontainer.json 里初始化好，避免每次重进都要手动配。
