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

https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers
这个插件允许我们在容器中运行 Visual Studio Code。
在项目的根目录中,您需要创建一个名为 .devcontainer 的文件夹。我们将在此处存储环境设置。
然后在此文件夹中创建两个文件,devcontainer.json 和一个 Dockerfile。
命名很重要,因为 Visual Studio Code 希望我们提供一些文件夹和文件名才能成功运行容器。
您的文件夹结构应如下:

在 Dockerfile 中,我们选择 Docker 镜像并在安装镜像后运行所需的任何命令(例如全局安装)。
FROM node:12.14.1-stretch
RUN npm install -g eslint prettier

然后,在 devcontainer.json 中,我们可以配置所有设置。
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 选项的完整列表。

检查一下
容器运行并连接后,您应该在状态栏的左下方看到远程上下文(remote context)更改:

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

远程状态栏项目可以快速向您显示在哪个上下文中运行 VS Code(本地或远程),单击该项目将弹出“Remote — Containers”命令。

选择在容器中重新打开。

等待容器构建
如果这是您的第一次连接,则将下载并构建 Docker 镜像,并将启动运行 VS Code Server 副本的容器。第一次可能需要几分钟,但以后的连接仅需几秒钟。

检查环境
在容器中进行开发的有用的事情之一是,您可以使用应用程序所需的特定版本的依赖关系,而不会影响本地开发环境。
node --version
npm --version
我是为少。
微信:uuhells123。
公众号:黑客下午茶。
谢谢点赞支持!
Happy Hacking!
1 分钟上手,在容器中运行 Visual Studio Code的更多相关文章
- 在 Ubuntu 中使用 Visual Studio Code
前言 我一直在 Linux 桌面系统下的探索寻找各种界面美观.使用舒适的软件工具.对于Linux下的开发人员来讲,这几年最大的福利就是 MicroSoft 推出的 Visual Studio Code ...
- Visual Studio Code 远程开发探秘
摘要: IDE新时代! 作者:SHUHARI 的博客 原文:Visual Studio Code 远程开发探秘 Fundebug按照原文要求转载,版权归原作者所有. 在以前的文章 有趣的项目 - 在浏 ...
- ASP.NET Core 中文文档 第二章 指南(1)用 Visual Studio Code 在 macOS 上创建首个 ASP.NET Core 应用程序
原文:Your First ASP.NET Core Application on a Mac Using Visual Studio Code 作者:Daniel Roth.Steve Smith ...
- ubuntu中安装visual studio code-(转载)
在Ubuntu中安装Visual Studio Code 编译自:http://itsfoss.com/install-visual-studio-code-ubuntu/ 作者: Abhishek ...
- Visual Studio Code 显示隐藏的.git文件和目录
在默认设置中,Visual Studio Code 将下列文件文件排除在显示列表中: "files.exclude": { "**/.git": true, & ...
- Java on Visual Studio Code的更新 – 2021年8月
Nick Senior Program Manager, Developer Division at Microsoft 大家好,欢迎来到 8 月版的 Visual Studio Code Java ...
- 在Linux和Windows的Docker容器中运行ASP.NET Core
(此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 译者序:其实过去这周我都在研究这方面的内容,结果周末有事没有来得及总结为文章,Scott H ...
- Docker容器中运行ASP.NET Core
在Linux和Windows的Docker容器中运行ASP.NET Core 译者序:其实过去这周我都在研究这方面的内容,结果周末有事没有来得及总结为文章,Scott Hanselman就捷足先登了. ...
- Alpine容器中运行go的二进制文件
Alpine容器中运行go的二进制文件 kuSorZ · 3月之前 · 214 次点击 · 预计阅读时间 1 分钟 · 2分钟之前 开始浏览 原文出处:https://cloud.tencent.co ...
随机推荐
- 浅析Python项目服务器部署
基础理论 关于Web服务器和应用服务器 基本概念: Web服务器主要功能就是存储.处理.传递网页,客户端和服务器之间基于HTTP协议进行通信. 应用服务器主要是处理动态请求,调用相应的对象完成对请求的 ...
- 事件修饰符 阻止冒泡 .stop 阻止默认事件 .prevent
stop修饰符 阻止冒泡行为 可以在函数中利用$event传参通过stopPropagation()阻止冒泡 通过直接在元素中的指令中添加 .stop prevent修饰符 阻止默认行为 可以在函数中 ...
- git基本操作(适合新手)
本人也是刚刚开始学习 大家可以一起交流,大佬可以在教一下 目录 git配置 git本地仓库 SSH提交方式,git提交远程仓库 一.git配置 git config --global user.nam ...
- ctf/web源码泄露及利用办法
和上一篇文章差不多,也算是对web源码泄露的一个总结,但是这篇文章更侧重于CTF 参考文章: https://blog.csdn.net/wy_97/article/details/78165051? ...
- SpringBoot从入门到精通教程(一)
写在前面的话: 在很早之前,记笔记时候,我就一直在思考一个问题,我记笔记是为了什么,我一直想不明白 ,后面发现技术跟新迭代的速度实在太快了,笔记刚纪完,技术又跟新了,于是我想了想干脆边写博客,边记笔记 ...
- Ubuntu替换清华源或者阿里源
倒腾pygame包的问题(Ubuntu 19.10),安装好pip后,又要安装一个pygame的包,倒腾了两天两夜,硬是因为网络问题(可能被强大的墙阻挡了),安装不成功,后面在网上找了篇帖子,用清华源 ...
- webform中DropdownList绑定多个字段
说明 ListItem中有Attributes属性,手动创建一个自定义属性,赋值需要绑定的字段的值. 这样的话,前台js也可以获取到,能够显示到前台html,进行控制. 代码 foreach(Data ...
- 使用CDN后如何配置Apache使其记录访客真实IP
今天想看看哪些地区的人访问过我的网站,于是打开Apache网站响应日志,把访客IP复制到百度,发现搜到的全部都是我是用的CDN的节点IP,真实的访客IP并没有被记录. 如图所示,上面的103.45.7 ...
- 超详细的第一个Servlet程序
Servlet的第一个程序! 首先查看官方文档,来编写我们的第一段代码 1.先启动Tomcat,确保我们能够正常访问. 2.http://localhost:8080/examples/ 查看 ...
- java集合大总结
Java集合大总结 java集合框架简图(API关系图): 虚线框表示接口,实线框表示类. 特点和使用总结: Collection: 单列单值. List: 有序(查询顺序和插入顺序一致),有下标(索 ...