1 分钟上手，在容器中运行 Visual Studio Code

时间 2021-01-20

标签 node linux docker shell npm json 数组 bash 微信 app 栏目 Visual Studio 繁體版

原文原文链接

https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containersnode

这个插件容许咱们在容器中运行 Visual Studio Code。linux

在项目的根目录中，您须要建立一个名为 .devcontainer 的文件夹。咱们将在此处存储环境设置。docker

而后在此文件夹中建立两个文件，devcontainer.json 和一个 Dockerfile。shell

命名很重要，由于 Visual Studio Code 但愿咱们提供一些文件夹和文件名才能成功运行容器。npm

您的文件夹结构应以下：json

在 Dockerfile 中，咱们选择 Docker 镜像并在安装镜像后运行所需的任何命令（例如全局安装）。数组

FROM node:12.14.1-stretch
RUN npm install -g eslint prettier

而后，在 devcontainer.json 中，咱们能够配置全部设置。bash

devcontainer.json 基本上是一个配置文件，该文件肯定如何构建和启动 dev 容器。微信

{
  "name": "Node.js Sample",
  "dockerFile": "Dockerfile",
  "appPort": 3000,
  "extensions": ["dbaeumer.vscode-eslint"],
  "settings": {
    "terminal.integrated.shell.linux": "/bin/bash"
  },
  "postCreateCommand": "yarn install",
  // Comment out the next line to run as root instead. Linux users, update
  // Dockerfile with your user's UID/GID if not 1000.
  "runArgs": ["-u", "node"]
}

dockerFile - 您要用做镜像的 Dockerfile 的路径。
appPort - 在容器运行时应在本地提供的端口或端口数组。
extensions - 扩展 ID 的数组，这些 ID 指定建立容器时应在容器内部安装的扩展。
settings - 将默认 settings.json 值添加到特定于容器/机器的设置文件中。
postCreateCommand - 建立容器后要运行的命令字符串或命令参数列表。
runArgs - 运行容器时应使用的 Docker CLI 参数数组

这是 devcontainer.json 选项的完整列表。app

检查一下

容器运行并链接后，您应该在状态栏的左下方看到远程上下文（remote context）更改：

安装了“Remote — Containers”扩展后，您将在最左侧看到一个新的状态栏项目。

远程状态栏项目能够快速向您显示在哪一个上下文中运行 VS Code（本地或远程），单击该项目将弹出“Remote — Containers”命令。

选择在容器中从新打开。

等待容器构建

若是这是您的第一次链接，则将下载并构建 Docker 镜像，并将启动运行 VS Code Server 副本的容器。第一次可能须要几分钟，但之后的链接仅需几秒钟。

检查环境

在容器中进行开发的有用的事情之一是，您可使用应用程序所需的特定版本的依赖关系，而不会影响本地开发环境。

node --version
npm  --version

我是为少。
微信：uuhells123。
公众号：黑客下午茶。
谢谢点赞支持👍👍👍！

Happy Hacking！