使用 WSL2 和 Docker 配置开发环境 | 青训营

1,502 阅读4分钟

写在前面

在本次的时间开发过程中,我想大家可能都遇到过开发环境难以统一的问题,比如你本地的环境可以正常运行,在团队其他成员却会出现 BUG 的情况,开发进度难以协调;又或者你使用的是 Windows 系统,而开发却使用 Linux 系统,环境和工具很难保持一致。那么有没有一种方法可以帮助我们迅速搭建一个统一的开发环境呢。

注意,本文不会去探讨容器技术的细节,只讨论具体的安装与使用,所以小白也可以继续往下看。(笔者也没学到呢orz)

WSL2

WSL2 是 Windows Subsystem Linux 2 的意思,不同于使用虚拟机,WSL2 是 Windows 的子系统,性能更高。其允许开发人员直接在 Windows 上运行 Linux 环境,包括大多数的命令行工具和应用程序。

我们可以以管理员模式在 Windows PowerShell 中直接使用命令安装,或者在Microsoft Store中搜索你想要的Linux 发行版进行安装。

具体步骤参考:安装 WSL | Microsoft Learn

wsl --install

在 WSL2 上,我们可以按照 Linux 的方式安装我们的开发环境,并使用VSCode的WSL插件进行连接,进行开发。 如此是好,但是我们团队的其他成员也要按照我们的操作进行一遍环境设置,更不要说如果你已经存在一个开发环境,但是你又不想因为此次开发影响之前的环境。

image.png

此时,我想起了 Docker 容器技术,如果我们可以使用镜像构建一个容器,包含我们需要的一切工具,不就可以在团队之间进行环境的统一了嘛,经过我的一番搜索,发现微软果真巨硬,早已提供了插件帮助我们构建统一的开发环境---Dev Containers - Visual Studio Marketplace

Dev Containers

Dev Containers 是微软官方推出的 Remote 系列插件,前身是 Remote Containers,Remote 系列插件还有我们前面说的 WSL 插件,RemoteSSH 插件等,可以帮助我们连接远程的主机,不管是物理机、虚拟机还是容器。实际的工作原理如图所示。

image.png

Getting Started

  1. 安装 Windows Docker Desktop | Docker

  2. 安装 安装 WSL | Microsoft Learn

  3. 配置 Docker Desktop

image.png

image.png

  1. 网络设置

由于众所周知的原因,我们需要对网络进行一定的配置,不然可能经常会访问失败。

首先是镜像加速配置。Docker 镜像加速 | 菜鸟教程 (runoob.com) image.png

然后有条件可以配置网络代理,这样容器内也可以进行代理。

image.png

  1. VSCode配置
    1. 安装 Dev Containers 插件
    2. F1打开 command palette,找到 Dev Containers: Open Folder in Container...
    3. 选择项目目录
    4. 选择自己的开发环境配置,这里我选择 Go image.png 5.接着选择自己需要的 features,比如 mysql、redis 6.等待拉取镜像并进行 build,项目根目录下会出现.devcontainer目录,该目录下有一个devcontainer.json文件存放配置信息。
  2. 此过程中可能会出现错误,查看多为网络错误,所以前面需要配置网络
  3. 安装完成后会在新窗口打开目录
  4. 仍然可能会报错

    错误类似于下面的形式

    Remote-Containers server: Remote to local stream terminated with error: {
    message: 'connect ENOENT \\.\pipe\openssh-ssh-agent',
    name: 'Error',
    stack: 'Error: connect ENOENT \\.\pipe\openssh-ssh-agent\n\tat ' +
    'PipeConnectWrap.afterConnect [as oncomplete] ' +
    '(net.js:1056:14)'
    }
    

经排查是由于 Windows 的 SSH-Agent 没有启动,解决方案是

PS C:\Developer> ssh-agent
unable to start ssh-agent service, error :1058

PS C:\Developer> Get-Service ssh-agent

Status   Name               DisplayName
------   ----               -----------
Stopped  ssh-agent          OpenSSH Authentication Agent


PS C:\Developer> Get-Service ssh-agent | Select StartType

StartType
---------
 Disabled


PS C:\Developer> Get-Service -Name ssh-agent | Set-Service -StartupType Manual
PS C:\Developer> ssh-agent
PS C:\Developer> Get-Service ssh-agent

Status   Name               DisplayName
------   ----               -----------
Running  ssh-agent          OpenSSH Authentication Agent

最终效果

VSCode 左下角会显示容器名字,也就是devcontainer.json中的name所定义的内容,mysql和redis也都可以正常使用。VSCode 中也可以安装开发插件,一切都像是在本地一样,非常方便。

image.png

image.png

image.png

如果说需要深度的定制镜像,需要自己编写 Dockerfile,这里就不再深入了。

参考资料

[1] Get started with development Containers in Visual Studio Code

[2] Beginner's Series to: Dev Containers | Microsoft Learn

[3] Dev Container metadata reference (containers.dev)