前言

大家好，今天要给大家分享一个超级实用的技巧——如何在VPS或者NAS上搭建一个在线的 VSCode 开发环境。
还在本地电脑上到处装环境、配依赖吗？是不是换台电脑就要重装一遍，非常麻烦？今天教你用 Docker 一键部署，把 VSCode 搬到云端，不管你用的是 Windows、Mac 还是 iPad，只要有浏览器，就能随时随地打开你的专属开发环境。

这种方式不仅能节省本地资源，还能让你的 VPS/NAS 秒变“云端编程神器”。对于经常出差、随时写代码的朋友来说，简直不要太方便！
接下来，我会手把手带你完成部署，一起告别繁琐的本地安装吧！

亮点

在任何设备上使用一致的开发环境进行编码
使用云服务器加速测试、编译、下载等
外出时节省电池寿命；所有密集型任务都在您的服务器上运行

配置项	最低要求
系统	启用 WebSockets 的 Linux 机器
内存	1 GB RAM
CPU	2 vCPU

项目图片

以下是与该项目相关的一些图片：
screenshot-1
screenshot-2

部署方法

使用Docker安装

本教程使用docker的方式安装部署,简单便捷
164b6ac419e23bc5390dc46601a202bf

准备条件

1）一台服务器或者NAS
我们使用飞牛云NAS和VPS来演示
需要vps的可以看以下信息
莱卡云官网
2）本项目使用到的github
https://github.com/coder/code-server

目前已经73.6k个 stars
更多功能可以访问GitHub
3）域名(可选)
域名可以根据自己的需求绑定

①《飞牛NAS上搭建》

直接在docker新增一个compose项目即可
新建项目：

code-server

compose配置如下：

services:
  code-server:  # 定义名为 code-server 的服务
    image: codercom/code-server:latest  # 使用官方 code-server 的最新镜像
    container_name: code-server  # 容器名称为 code-server
    ports:
      - "8780:8080"  # 将宿主机的 8780 端口映射到容器的 8080 端口
    volumes:
      - ./.config:/home/coder/.config  # 将当前目录下的 .config 目录挂载到容器中用户的配置目录
      - ./project:/home/coder/project  # 将当前目录下的 project 目录挂载为容器内的项目目录
    environment:
      - PASSWORD=asd123456  # 设置 code-server 登录密码
    stdin_open: true  # 保持标准输入打开（适用于交互式终端）
    tty: true  # 为容器分配一个伪终端（常用于交互式应用）
    restart: always  # 设置容器为自动重启，容器退出时会自动重启

启动即可

正常启动

补充docker可用的镜像仓库

国内如果无法拉取镜像的可以使用
仓库1

https://proxy.1panel.live/

仓库2

https://docker.1panel.top/

仓库3

https://mirror.azure.cn/

仓库4

https://hub.rat.dev/

仓库5

https://docker.1ms.run

仓库6

https://docker.itelyou.cf/

仓库7

https://abc.itelyou.cf/

仓库8

https://docker.ywsj.tk/

②《vps上搭建》

一、Docker环境部署

在vps安装docker和docker-compose
Docker官方安装文档（英文）
https://duan.yyzq.eu.org/docker-001
Docker-Compose官方安装文档（英文)
https://duan.yyzq.eu.org/docker-002
Centos安装Docker和Docker-compose（中文）
https://duan.yyzq.eu.org//03
Ubuntu安装Docker和Docker-compose（中文）
https://duan.yyzq.eu.org//04

推荐直接用一键脚本

docker安装脚本

bash <(curl -sSL https://cdn.jsdelivr.net/gh/SuperManito/LinuxMirrors@main/DockerInstallation.sh)

docker-compose安装脚本

curl -L "https://github.com/docker/compose/releases/latest/download/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose && chmod +x /usr/local/bin/docker-compose

二、创建docker-compose.yml文件

mkdir code-server;cd code-server #创建一个目录，并进入此目录

然后再新建docker-compose.yml

vim docker-compose.yml

services:
  code-server:  # 定义名为 code-server 的服务
    image: codercom/code-server:latest  # 使用官方 code-server 的最新镜像
    container_name: code-server  # 容器名称为 code-server
    ports:
      - "8780:8080"  # 将宿主机的 8780 端口映射到容器的 8080 端口
    environment:
      - PASSWORD=asd123456  # 设置 code-server 登录密码
    stdin_open: true  # 保持标准输入打开（适用于交互式终端）
    tty: true  # 为容器分配一个伪终端（常用于交互式应用）
    restart: always  # 设置容器为自动重启，容器退出时会自动重启

三、执行容器运行命令

docker-compose up -d #运行容器

docker-compose ps  #查看是否开启成功

正常启动如下所示

docker-compose ps
NAME          IMAGE                         COMMAND                  SERVICE       CREATED          STATUS          PORTS
code-server   codercom/code-server:latest   "/usr/bin/entrypoint…"   code-server   24 minutes ago   Up 23 minutes   0.0.0.0:8780->8080/tcp, [::]:8780->8080/tcp

四、打开web页面使用

成功以后需要打开自己相应的端口(8780)防火墙就可以web端访问了
打开自己VPS/或者飞牛云NAS的ip加端口就可进入初始化页面

http://ip:8780

输入密码即可

如果需要进入容器内部安装依赖的可以执行以下命令

docker exec -it code-server /bin/bash

其他功能自行摸索

五、绑定域名

如果是公网访问记得使用https方式并绑定域名使用
如需绑定域名的自行绑定
绑定域名可以参考
NginxProxyManager
https://duan.yyzq.eu.org//npm-ch
绑定完域名配置好证书就可以用域名来访问了

有任何问题可以直接留言或者问我
有任何问题可以直接留言或者问我
有任何问题可以直接留言或者问我

欢迎关注我们的微信公众号！

目录CONTENT

再见本地安装！教你在VPS/NAS上搭建在线VSCode开发环境code-server

前言

亮点