Skip to main content

Create dev container

原文 Create a development container

创建 devcontainer.json 文件​

VS Code 的容器配置存放在 devcontainer.json 文件中. 该配置文件路径位于 .devcontainer/devcontainer.json 或者 .devcontainer.json (项目根目录).

通过修改配置文件可以做以下事情:

下面配置文件指定容器镜像, 并在容器内安装 ESLint 扩展, 并自动转发3000端口号:

.devcontainer/devcontainer.json
{
  "image": "mcr.microsoft.com/vscode/devcontainers/typescript-node:0-12",

  "customizations": {
    "vscode": {
      "extensions": ["dbaeumer.vscode-eslint"]
    }
  },
  "forwardPorts": [3000]
}

有了上面的配置, 你的开发容器就可以使用了, 执行 Remote-Containers: Reopen in Container 就可以开始使用容器开发了: remote-containers-reopen

安装其他软件​

一旦VS Code连上了容器, 比那可以使用命令行安装其他软件和服务.

重建​

当你修改了 .devcontainer 文件夹下的内容, 需要使用命令 Remote-Containers: Rebuild Container 重新构建更新容器, 才能让修改生效.

然而重新构建会删掉之前手动在容器里安装过的一切, 你不得不再次重新安装. 为了避免这个问题, 你可以使用 postCreateCommand 属性, 这个属性会在容器创建的时候执行一次, 可以在这个属性配置一些 npm install 命令或者其他shell脚本:

.devcontainer/devcontainer.json
{
    "postCreateCommand": "bash scripts/install-dev-tools.sh"
}

postStartCommand 命令和 postCreateCommand 类似, 区别在于 postStartCommand 会在每次容器启动时执行.

相比较在 devcontainer.json 配置文件中指定镜像, 或者使用 postCreateCommand/postStartCommand 命令安装软件, 使用 Dockerfile 是中更高效的方式.

Dockerfile​

Dockerfile 文件页位于 .devcontainer 文件夹中, 可以将 image 属性替换成 build.dockerfile:

.devcontainer/devcontainer.json
{
  "build": { "dockerfile": "Dockerfile" },

  "customizations": {
    "vscode": {
      "extensions": ["dbaeumer.vscode-eslint"]
    }
  },

  "forwardPorts": [3000]
}