运筹帷幄间,决胜千里外——VS Code远程开发环境搭建

  VS Code推出远程开发环境的方式,只需要在远程的Linux服务器上配置好开发环境,用VS Code连接上,就可以像在本机一样进行开发,而无需在本机安装任何开发软件。特别是如果需要在不同的开发环境(例如软件版本等)切换时,配置多台远程服务器即可实现快速切换,大大简化了搭建开发环境的工作量。
  网上已经有不少VS Code远程开发环境文档,但都写的语焉不详;特别是遇到问题时很难定位。
  本文以Python为例,详细说明VS Code远程开发环境的搭建。

Linux下Python开发环境的搭建

  这里以Ubuntu 18.04为例,首先创建一台Ubuntu Server 18.04的VM。
  完成后ssh登录到该VM:

  照例先执行一遍升级:
  sudo apt update && sudo apt upgrade

  检查一下python是否正常:

  顺便装上pip,便于使用:
  sudo apt install python3-pip

  Linux下Python开发环境搭建完成。

VS Code配置

  安装好VS Code,打开通过左侧边栏进入扩展管理,并搜索remote,并安装Remote Development:

  安装完成重启VS Code,再次进入扩展管理,可以看到Remote Development及相关扩展已安装:

  同时会发现左侧边栏会多出一个Remote Explorer的选项:

  现在SSH TARGET还是空的,没有远程主机。
  首先在安装VS Code的电脑上测试能否连接到远程的Linux服务器:

  测试通过。
  回到VS Code,打开全局命令窗口(Ctrl+Shift+p),输入ssh,弹出包含ssh的命令:

  
  点击Remote-SSH:Add New SSH Host…,输入连接远程Linux主机的ssh命令:
  ssh vscdemo@139.217.218.120

  回车后弹出选择存放到哪个配置文件(不同OS下显示的方式会有差异):

  根据个人习惯,我习惯存放到~/.ssh/config。
  现在可以看到SSH TARGET多出来了一台主机:

  选择该主机,点击旁边新建窗口的按钮:

  打开一个新的VS Code窗口,并要求输入密码:

  登录成功,左下角显示连接主机状态:

  打开一个终端窗口(Ctrl+Shift+`):

  这个终端窗口相当于ssh到Linux服务器。
  在终端窗口创建一个工作目录:

  点击左侧边栏左上边的浏览按钮:

  点击Open Folder,定位到刚创建的目录:

  配置好了工作环境。
  现在写个代码试试。点击创建一个新文件:

  按照python文件的命名规则,新文件以py为后缀:

  同时,VS Code感知到这是一个python文件,右下角弹出提示,建议安装Python插件,点击安装:

  Reload后Python插件生效,右下角又跳出提示,建议安装Linter工具:

  点击安装,可以看到Linter安装在远程的Linux服务器上:

  在下方任务栏可以看到,启用了远程服务器的Python3.6.9.64-bit作为Python的运行环境。
  写个简单的代码测试一下:

  VS Code连接到远程的Linux服务器,启用Python成功运行。

远程服务器连接方式

  虽然已经可以使用VS Code连接到Linux服务器编程开发,但是使用过程中有个问题,每次打开新窗口或者限制时间稍长,连接就会断开,需要再次输入用户名和密码。如何解决这个问题?SSH Key是个很好的方式。
  在安装VS Code的电脑上执行ssh-keygen命名创建一个秘钥码对(也可以使用本机或其他电脑创建好的秘钥对):
  ssh-keygen -t rsa -b 4096

  默认保存在~/.ssh/目录。
  用公钥创建一台VM,并测试是否可以ssh登录(用-i参数指定私钥):
  ssh vscdemo@40.73.76.69 -i ~/.ssh/id_rsa

  成功登录。
  如上一步在VS Code的全局命令窗口里用Remote-SSH:Add New SSH Host…添加新主机:

  同样将配置保存在~/.ssh/config文件。
  添加完成在SSH TARGET里测试连接成功:

  所以SSH Key提供了一个更方便安全的方式连接到远程服务器。
  再来看看保存连接的配置文件:
  more ~/.ssh/config

  这是一个标准的ssh登录配置文件,指明了主机地址、用户名、私钥存放位置(SSH key方式)。VS Code通过读取这个文件来设置SSH TARGET。
  做个小小测试,将该文件命名为config.bak:

  再打开VS Code,SSH TARGET为空:

  将config.bak重命名回config,并修改第一台服务器配置文件的Host字段为Linux01:

  再次打开VS Code,检查SSH TARGET:

  第一台服务器已经显示为Linux01。
  由此可见,config文件里,Host是显示的主机的名字,HostName才是真正主机地址(ip或dns名字)。
  添加远程主机时,可以通过修改config文件的方式,而无需一定要在VS Code里操作。

Python环境那些事

  作为一种“胶水”编程语言,Python会经常要安装各种package,装多了就容易乱。所以最好有一个方法能在同一个开发环境里隔离出若干虚拟环境,各自安装各自的package。而virtualenv就提供了这个功能。
  还是在VS Code里连接到远程的Linux服务器并打开终端窗口:

  在终端窗口运行如下命令安装virtualenv:
  sudo apt install -y virtualenv

  接着在终端窗口创建一个工作目录,进入目录后配置为virtualenv环境并激活:
  mkdir demovenv
  cd demovenv
  virtualenv --no-site-packages venv
  source venv/bin/active

1
2
3
注:
--no-site-packages表示不从环境中继承任何package
加上--python-python3可以选择python版本

  Linux提示符前出现(venv)说明虚拟环境配置成功。
  在左侧边栏的浏览选项中添加新建目录并创建一个python文件,按提示安装Python相关扩展,完成后如下:

  注意下边状态栏里,Python的运行环境变成了virtualenv。
  退出virtualenv的方式很简单,在终端窗口执行如下命令即可:
  deactivate

小结

  VS Code的Remote开发方式不仅可以连接远程服务器,甚至还可连接本机的wsl环境。通过这样的配置,可以降低对本机的性能要求,同时也简化了不同版本、package的安装调试,希望对大家有用。