使用 Live Share 合作编辑、调试并运行代码

使用 Live Share 合作编辑、调试并运行代码

Created
Mar 11, 2020 8:06 AM

功能演示

简单来说,你可以和别人:

共享代码编辑,并查看对方的编辑位置,避免通过截图交流的尴尬

共同调试,多人调试相同代码,快速查找到问题

共同查看成果,IIS Express 的网页也会在每个人的电脑本地打开

配置步骤

Windows 开发环境配置

  1. 安装最新版的 Visual Studio(我这边是 2019 16.4.6)并在 Visual Studio 里登录自己的微软账号
  2. 点击右上角的 Live Share。第一次使用,会弹出防火墙提示,请打开。
  3. image
  4. 第一次启动可能会比较慢,稍等片刻,启动完成则会看到这条提示
  5. image
  6. 复制共享链接,或是可以点开详细信息获取功能描述
  7. image

macOS 环境配置

  1. 安装 Visual Studio Code,然后安装 Live Share 插件
  2. image
  3. 安装完毕后在左侧功能区找到 Live Share 并打开,点击这里,填写共享地址。输入后回车即可连接。
  4. image
  5. 连接成功后,即可看到项目目录
  6. image
  7. 在 Visual Studio 里点击运行,macOS 上的 Visual Studio Code 同样会进入 debug 状态。并且,IIS Express 的网页也会共享过来,非常方便。
  8. image
    image

其他设置

基本权限设置

若要在 Visual Studio Code 中也能开始编译并运行,需要进行权限设置,否则会提示如下错误

image

只需要在 Visual Studio 的选项中找到 Live Share - 常规,将图中两个位置改为 True 即可

image

网络设置

建立连接通过香港的微软服务器握手,如果主端没有公网 IP,则会全程通过微软服务器转发内容,速度可能会比较慢。但如果有公网 IP,请打开 5990 端口,并建议打开后面的端口例如 5991、5992等等,因为如果 5990 被占用,则会顺延。同时也建议打开路由器的 UPnP 功能。