VSCode 通过 Remote-Containers 扩展实现真正“进容器开发”。安装扩展后，用 .devcontainer/devcontainer.json 定义镜像、工具、端口等，一键在容器内编码、调试、运行，环境可复现、团队一致。
VSCode 和 Docker 结合，能让本地开发环境更干净、可复现，也更容易和生产环境对齐。关键不是“装上就用”，而是理解怎么让 VSCode 真正“进到容器里”去写代码、调试、运行——而不是只在宿主机上敲 docker 命令。
用 Remote-Containers 打开项目，直接在容器里编码
这是最核心的体验升级。安装官方扩展 Remote - Containers 后，打开一个文件夹，点击左下角绿色按钮（或按 Ctrl+Shift+P → “Remote-Containers: Open Folder in Container”），VSCode 就会根据项目里的 .devcontainer/devcontainer.json 自动构建镜像、启动容器，并把整个工作区挂载进去。
- devcontainer.json 定义了基础镜像、要安装的工具（如 Python、Node.js、Go）、端口转发、环境变量，甚至启动后自动执行的命令
- 你编辑的代码实时存在容器里，终端也是容器内的 shell，git、npm、python manage.py runserver 全部原生运行
- 不需要手动 docker build / docker run，也不用反复 cp 文件或改路径
调试器也能进容器：断点、变量、调用栈全正常
只要容器里装了对应语言的调试支持（比如 Python 的 ptvsd 或 debugpy，Node 的 --inspect），并在 devcontainer.json 中配置好端口转发和 launch.json，VSCode 的调试器就能无缝连接。
- 例如 Python 项目：在容器内启动服务时加上 --no-browser --port=8000 --host=0.0.0.0，再把 8000 端口映射出来，launch.json 里设好 "attach" 模式和端口，F5 就能连上
- 调试时看到的路径是容器内的路径（如 /workspace/src/main.py），但 VSCode 会自动映射到你本地打开的文件，断点不掉、变量可查
共享配置，团队协作少踩坑
把 .devcontainer/ 提交到 Git，所有人拉代码后一键进容器，环境完全一致。
Angel工作室企业网站管理系统全DIV+CSS模板，中英文显示，防注入sql关键字过滤，多浏览器适应，完美兼容IE6-IE8,火狐，谷歌等符合标准的浏览器，模板样式集中在一个CSS样式中，内容与样式完全分离，方便网站设计人员开发模板与管理。系统较为安全，以设计防注入，敏感字符屏蔽。新闻，产品，单页独立关键字设计，提高搜索引擎收录。内置IIS测试，双击打启动预览网站 Angel工作室企业网站
- 避免“我本地跑得好好的，怎么 CI 报错了？”——因为 CI 可以复用同一份 devcontainer 配置做测试环境
- 新成员不用看长达一页的“本地环境搭建指南”，打开 VSCode → Open in Container → 等两分钟 → 开始写代码
- 不同项目可用不同基础镜像（如前端用 node:18，后端用 python:3.11-slim），互不干扰
小技巧让体验更顺滑
有些细节不注意，容易卡住或白忙活：
- 确保 Docker Desktop 正在运行，且用户在 docker 组里（Linux/macOS）；Windows 用户推荐开启 WSL2 后端
- 如果容器启动失败，点左下角绿色按钮 → “Reopen in Container”，再看 VSCode 右下角弹出的构建日志，错误通常很明确（比如 apt 源超时、缺少 build-essential）
- 需要图形界面（如 Electron 调试）？得额外配 X11 转发或用 VSCode Web 版 + 容器内浏览器
基本上就这些。不需要改 workflow，也不用学新语法，几个配置文件 + 一个扩展，就能把开发环境从“本机拼凑”变成“容器封装”。不复杂，但容易忽略。
