如何通过VSCode进行容器化开发和Docker集成？-VSCode-PHP中文网

VSCode通过Docker和Dev Containers扩展实现容器化开发，答案是使用这两个核心扩展并配置devcontainer.json文件。首先安装Docker Desktop与VSCode，再安装Docker扩展用于可视化管理镜像、容器等资源，而Dev Containers扩展则支持在容器内开发，通过.devcontainer文件夹中的配置文件定义开发环境，利用绑定挂载使代码在本地与容器间共享，实现环境隔离与一致；对于多服务应用，可结合docker-compose.yml，在devcontainer.json中指定dockerComposeFile、service等属性，一键启动完整服务栈并在指定容器中进行开发调试，提升团队协作效率与环境复现能力。

如何通过vscode进行容器化开发和docker集成？

VSCode通过其强大的扩展生态系统，特别是“Docker”和“Dev Containers”扩展，极大地简化了容器化开发和Docker集成。它允许你直接在容器内部进行编码、调试，并管理Docker资源，使得开发环境的配置和共享变得前所未有的高效和一致，对我而言，这几乎改变了我对开发环境管理的认知。

解决方案

在我看来，VSCode与Docker的结合，是现代开发流程中不可或缺的一环。它不仅仅是把代码放在容器里跑那么简单，更是一种开发哲学的转变——从“在我机器上能跑就行”到“在任何地方都能一致地跑”。

首先，你需要确保你的系统上已经安装了Docker Desktop（或者Docker Engine）和VSCode。这是基础中的基础，没有它们，一切都无从谈起。

核心扩展的安装与作用：

Docker 扩展 (Microsoft提供): 这是管理Docker资源的核心工具。安装后，VSCode的侧边栏会出现一个鲸鱼图标，你可以在这里直观地查看、管理你的Docker镜像、容器、卷和网络。对我来说，这比在命令行里敲各种
```
docker ps
```
登录后复制
、
```
docker images
```
登录后复制
要方便太多，尤其是在需要快速查看容器状态或日志时。它还支持直接从Dockerfile构建镜像，甚至推送和拉取到注册表。
Dev Containers 扩展 (Microsoft提供): 这是真正实现“在容器内开发”的魔法所在。它允许你将一个文件夹（你的项目代码）在Docker容器内部打开，并在这个隔离的环境中进行所有开发工作。这意味着你的本地机器只需要安装VSCode，而所有语言运行时、SDK、依赖项都封装在容器里。这解决了长期困扰开发者的“环境不一致”问题，尤其是在团队协作或新成员入职时，简直是神器。

工作流程概览：

管理Docker资源： 使用Docker扩展，你可以启动、停止、删除容器，查看容器日志，检查镜像详情，甚至直接进入容器的shell。
容器化开发环境： 使用Dev Containers扩展，你可以在项目根目录创建一个
```
.devcontainer
```
登录后复制
文件夹，并在其中定义
```
devcontainer.json
```
登录后复制
文件。这个文件会告诉VSCode如何构建或启动一个容器作为你的开发环境。你可以指定一个基础镜像、安装特定的VSCode扩展、转发端口、挂载卷，甚至在容器启动后运行自定义命令。
调试与开发： 一旦你的项目在Dev Container中打开，VSCode就像在本地一样工作。你可以在容器内部编辑代码、设置断点、进行调试，所有的终端命令也都在容器内部执行。这意味着你的本地机器可以保持非常“干净”，而项目所需的复杂环境则由容器提供。
Docker Compose集成： 对于多服务应用（比如一个前端、一个后端和一个数据库），Dev Containers可以与Docker Compose无缝集成。你可以在
```
devcontainer.json
```
登录后复制
中引用
```
docker-compose.yml
```
登录后复制
文件，让VSCode一次性启动所有服务，并在其中一个服务容器中打开你的开发环境。

在我看来，这种方式不仅提升了开发效率，更重要的是，它提供了一种高度可复现和共享的开发环境，这在现代软件工程中是极其宝贵的。

VSCode容器化开发，究竟需要哪些核心扩展和初始设置？

说实话，初次接触容器化开发，很多人可能会觉得有点摸不着头脑，但一旦掌握了核心工具，你会发现它其实非常直观。对于VSCode的容器化开发，核心中的核心，无疑就是那两个由Microsoft提供的官方扩展：Docker 和 Dev Containers。

Docker扩展： 它的作用更偏向于Docker资源的“管理和可视化”。想象一下，你不需要频繁切换到命令行，就能在VSCode的侧边栏看到所有正在运行的容器、已下载的镜像、创建的卷和网络。我可以很方便地右键点击一个容器，选择“Start”、“Stop”、“Remove”，或者“View Logs”，这比记住那些复杂的

docker

登录后复制

命令要省心多了。对我来说，它更像是一个Docker的图形化操作界面，极大地降低了日常Docker操作的门槛。

Dev Containers扩展： 这个才是真正让你能在容器里写代码的“魔法”所在。它的核心理念是“将你的开发环境打包进容器”。当你安装并启用了这个扩展后，VSCode会多出一个“Reopen in Container”的选项。当你选择它时，VSCode会根据你项目根目录下的

.devcontainer/devcontainer.json

登录后复制

文件来构建或启动一个Docker容器，然后把你的整个VSCode工作区（包括编辑器、终端、调试器等）都连接到这个容器内部。这意味着，你的Python解释器、Node.js运行时、Java SDK，乃至各种系统依赖，都可以只存在于这个容器中，而不会污染你的本地系统。

初始设置：

安装Docker Desktop/Engine： 这是所有Docker操作的前提。确保它正在运行，并且VSCode能够访问到Docker守护进程。
安装VSCode和上述两个扩展： 在VSCode的扩展市场搜索并安装它们。
创建
.devcontainer
登录后复制
文件夹和
devcontainer.json
登录后复制
文件：这是定义你的容器化开发环境的关键。通常，你可以在VSCode中打开一个项目文件夹，然后按下
```
F1
```
登录后复制
，输入“Dev Containers: Add Dev Container Configuration Files...”，VSCode会引导你选择一个预设的配置（比如Node.js, Python, Java等），或者从
```
Dockerfile
```
登录后复制
或
```
docker-compose.yml
```
登录后复制
创建。一个简单的
```
devcontainer.json
```
登录后复制
可能长这样：
```
{
    "name": "My Python Project",
    "image": "mcr.microsoft.com/devcontainers/python:0-3.10",
    "features": {
        "ghcr.io/devcontainers/features/common-utils:2": {
            "installZsh": true,
            "installOhMyZsh": true,
            "upgradePackages": true
        }
    },
    "forwardPorts": [5000],
    "postCreateCommand": "pip install -r requirements.txt",
    "customizations": {
        "vscode": {
            "extensions": [
                "ms-python.python",
                "esbenp.prettier-vscode"
            ]
        }
    }
}
```
登录后复制
这个文件定义了：容器的名称、使用的基础镜像、安装的特性（如zsh）、需要转发的端口、容器创建后执行的命令，以及在容器内部安装的VSCode扩展。对我来说，这个文件就是我的开发环境的“蓝图”，它让我的环境配置变得可版本控制，可共享。

通过这些核心扩展和初始设置，你就搭好了VSCode容器化开发的舞台。剩下的，就是在这个舞台上尽情挥洒你的代码了。

用Dev Containers构建隔离开发环境，我的代码到底跑在哪里？

这其实是很多初学者最关心的问题，也是Dev Containers最巧妙的地方。当你选择“Reopen in Container”时，你的代码并没有被复制到容器内部，而是通过一种称为“绑定挂载 (Bind Mount)”的机制，让容器可以直接访问你本地文件系统上的代码。

想象一下，你的本地项目文件夹就像一个仓库，Dev Container就是一辆叉车。这辆叉车不需要把仓库里的货物（你的代码）搬到自己车上，它只需要把车停在仓库门口，就能直接操作仓库里的货物。

具体过程是这样的：

GPT-MINUS1

通过在文本中随机地用同义词替换单词来愚弄GPT

查看详情

VSCode启动一个Docker容器： 这个容器是根据你的
```
devcontainer.json
```
登录后复制
配置创建的。
绑定挂载你的项目目录： VSCode会把你的本地项目目录（例如
```
/Users/youruser/my-project
```
登录后复制
）挂载到容器内部的一个指定路径（通常是
```
/workspaces/my-project
```
登录后复制
）。这意味着，在容器内部，
```
/workspaces/my-project
```
登录后复制
这个路径下看到的文件，就是你本地机器上的文件。
VSCode客户端连接到容器内部的VSCode Server： 这听起来有点绕，但很关键。你的本地VSCode界面只是一个“瘦客户端”，它通过SSH或Docker exec连接到运行在容器内部的一个小型VSCode Server。所有的代码编辑、文件操作、终端命令、调试会话，实际上都是在这个容器内部的VSCode Server上执行的。
无缝的开发体验： 由于绑定挂载的存在，你在VSCode中修改文件，这些修改会立即反映到你的本地文件系统上。反之亦然，如果你在本地文件系统上修改文件，容器内的VSCode也会立即感知到。这使得你在容器内外切换时，几乎感觉不到文件的差异。

核心优势：

真正的隔离： 容器内部安装的任何依赖、库、环境变量，都只存在于这个容器中，不会影响你的本地系统。这对我来说，意味着我可以同时开发多个项目，每个项目都有自己特定的环境，互不干扰。
一致性： 团队成员共享同一个
```
devcontainer.json
```
登录后复制
文件，就能确保每个人都拥有完全相同的开发环境，大大减少了“在我机器上能跑”的问题。
快速上手： 新成员加入项目，只需要克隆代码库，VSCode就会提示“Reopen in Container”，然后自动构建好所有开发环境，省去了漫长的环境配置过程。
资源管理： 容器可以被轻松地停止、删除，释放资源，而不会在本地留下任何痕迹。

这种“代码在本地，开发在容器”的模式，对我来说，是Dev Containers最吸引人的地方。它提供了一种既能享受容器隔离性，又能保持本地文件系统便利性的两全其美方案。

当项目变得复杂，VSCode又能如何协同Docker Compose管理多服务应用？

当你的项目不再是简单的单体应用，而是涉及到多个服务，比如一个前端应用、一个后端API、一个数据库，甚至可能还有消息队列、缓存服务等等，这时

docker-compose.yml

登录后复制

文件就成了你的得力助手。而VSCode的Dev Containers扩展，与Docker Compose的结合，简直是为这种复杂场景量身定制的。

在我过去的经验里，管理多服务应用的环境配置常常是个噩梦。你需要手动启动多个容器，确保它们之间的网络连接正确，还要为每个服务配置独立的开发环境。但有了VSCode和Docker Compose的联手，这一切都变得井井有条。

Docker Compose的作用：

docker-compose.yml

登录后复制

文件允许你用声明式的方式定义和运行多个Docker容器应用。你可以在一个文件中定义所有服务（service），包括它们使用的镜像、端口映射、卷挂载、环境变量和网络配置。通过

docker compose up

登录后复制

一个命令，就能启动整个应用栈。

VSCode Dev Containers与Docker Compose的集成： Dev Containers扩展非常聪明，它不仅能从单个

Dockerfile

登录后复制

构建开发环境，也能从

docker-compose.yml

登录后复制

文件启动一个多服务环境，并在其中一个服务容器中打开你的VSCode工作区。

这通常通过在

devcontainer.json

登录后复制

中配置以下几个关键属性来实现：

dockerComposeFile
登录后复制
：指定你的
```
docker-compose.yml
```
登录后复制
文件的路径。
service
登录后复制
：指定你希望在哪个服务容器中打开VSCode工作区。例如，如果你的
```
docker-compose.yml
```
登录后复制
中有一个名为
```
backend
```
登录后复制
的服务，你就可以在这里指定
```
"service": "backend"
```
登录后复制
。
workspaceFolder
登录后复制
：定义在指定服务容器中，你的项目代码应该挂载到哪个路径。
shutdownAction
登录后复制
：定义当你关闭VSCode窗口时，Docker Compose应用栈应该如何处理（例如，
```
"stopCompose"
```
登录后复制
只停止服务，
```
"down"
```
登录后复制
则会移除容器和网络）。

一个简单的

devcontainer.json

登录后复制

与
docker-compose.yml
登录后复制
结合的例子：

docker-compose.yml

登录后复制

version: '3.8'
services:
  backend:
    build:
      context: ./backend
      dockerfile: Dockerfile
    ports:
      - "8000:8000"
    volumes:
      - ./backend:/app # 挂载后端代码
    environment:
      DATABASE_URL: "postgresql://user:password@db:5432/mydb"
    depends_on:
      - db
  frontend:
    build:
      context: ./frontend
      dockerfile: Dockerfile
    ports:
      - "3000:3000"
    volumes:
      - ./frontend:/app # 挂载前端代码
  db:
    image: postgres:13
    environment:
      POSTGRES_DB: mydb
      POSTGRES_USER: user
      POSTGRES_PASSWORD: password
    volumes:
      - db_data:/var/lib/postgresql/data

volumes:
  db_data:

登录后复制

.devcontainer/devcontainer.json

登录后复制

{
    "name": "My Multi-Service App",
    "dockerComposeFile": "../docker-compose.yml", // 指向项目根目录的docker-compose.yml
    "service": "backend", // 在backend服务容器中打开VSCode
    "workspaceFolder": "/app", // 项目代码在容器内的路径
    "forwardPorts": [8000, 3000], // 转发后端和前端的端口
    "postCreateCommand": "cd /app && pip install -r requirements.txt", // 后端服务启动后安装依赖
    "customizations": {
        "vscode": {
            "extensions": [
                "ms-python.python",
                "dbaeumer.vscode-eslint"
            ]
        }
    }
}

登录后复制

当我打开项目，选择“Reopen in Container”时，VSCode会读取