coder-server 是著名的 Visual Studio Code 开源编辑器的 Web 版，本篇博客使用群晖的 Docker 组件（玩群晖怎能不玩 Docker？），完全图形化界面来搭建 code server，以及解决部署后产生的问题，部署过程简单易操作，容器占用资源少。

code server github：cdr/code-server: VS Code in the browser
code server docker hub：codercom/code-server - Docker Hub

群晖 Docker 的安装及 code-server 容器的创建

若没有安装 docker，打开套件中心，直接搜索 Docker，安装即可。

群晖安装Docker

群晖安装 Docker

打开 docker，在注册表里搜索 code-server，第一个即为官方镜像，双击下载。

拉取code-server

拉取 code-server

等待下载完成后，在映像中双击即可创建容器，首先看一下官方的部署代码

1
2
3
4
 
docker run -it -p 127.0.0.1:8080:8080 \
  -v "$PWD:/home/coder/project" \
  -u "$(id -u):$(id -g)" \
  codercom/code-server:latest
复制

其中 8080:8080 为端口映射，-v 为卷映射，-u 为用户权限映射，权限映射在 Docker Gui 界面不需要设置。

创建code server容器

创建 code server 容器

自动启动根据需要勾选，即群晖开机或重启后是否自动运行此容器。

自动启动

自动启动

添加对应的文件夹映射，首先在 File Station 中创建需要的文件夹，然后建立映射。

文件夹映射

文件夹映射

端口映射，避免冲突即可，若 8080 没被占用，直接默认即可，或者自行设置本地端口，如我设置为 18080。然后点击应用即可创建容器。

code-server 密码的获取

密码获取及修改

浏览器打开群晖 IP: 端口，默认端口为 IP:8080，即可看到 web 界面，我们已成功部署了 code-server。

密码在容器的 ~/.config/code-server/config.yaml 文件里，我们直接在终端查看即可。

获取web登录密码

获取 web 登录密码

终端机输入：

1
 
cat ~/.config/code-server/config.yaml
复制

即可成功登录。

code-server界面

code-server 界面

若需要修改密码，直接在浏览器修改，然后重启容器即可。

修改密码

修改密码

映射文件夹权限问题

我们在默认的 project 目录 /home/coder/project 下创建文件，出现报错：

权限错误

权限错误

我们在映射的文件夹中设置 EveryOne 权限为读写即可解决（开始时我还以为是没有执行 -u "$(id -u):$(id -g)" 导致的，折腾半天）

设置映射文件夹权限

设置映射文件夹权限

若为灰色。则在高级选项 —— 使继承权限显示化。

到此，全部完成，在浏览器里愉快地玩 VsCode 吧。