0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

关于VS Code实现远程开发的配置方法详细教程

strongerHuang 来源:面包板社区 作者:strongerHuang 2021-04-27 10:15 次阅读
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

VS Code几乎是所有的程序员必备的工具之一,据说全球一般的开发者都使用过VS Code这款工具。

今天为大家介绍一下 VS Code 实现远程办公的方法。

概述通常,我们都是每天到工作的办公室进行办公,但是,如果下班回家,或者出差,此时如果马上需要重要的文件,或者升级一下代码,是不是必须要回到办公室才行啊?

但是,如果你电脑配置了远程办公,这种问题就迎刃而解了。

首先说下VS Code远程开发的工作原理,大致是这样的:

c2644eb2-a680-11eb-aece-12bb97331649.png

VS Code 远程开发原理

下面结合Win10、Linux云主机给大家讲讲实现远程开发的方法。

远程开发配置

1.配置SSH环境变量

我们远程开发本地 VS Code 用 SSH 协议与远程服务端通信。所以需要配置SSH环境变量,我们使用Git自带SSH客户端程序:

c271c808-a680-11eb-aece-12bb97331649.png

SSH程序

如果你还没装Git的话,建议先安装 Git,所以配置 Git 的 bin目录到环境变量的 PATH 变量下,这样VS Code连接的时候就能找到它了。

c58cd7c6-a680-11eb-aece-12bb97331649.png

环境变量

2.安装远程开发插件

要能连上远程主机,首先我们需要下载VS Code远程开发插件,VS Code其实是提供了一个远程开发插件包,包括:

c5c1b69e-a680-11eb-aece-12bb97331649.png

远程开发插件

Remote - SSH - 通过使用 SSH 链接虚拟或者实体Linux主机。

Remote - Containers – 连接 Docker 开发容器。

Remote - WSL - 连接 Windows Subsystem for Linux (Linux子系统)。

打开软件的扩展界面,搜索 Remote 开头的插件,也能看到这三个的不同远程开发插件。我们这里连接的是云主机,选择安装 Remote - SSH 插件安装即可。

3.配置远程连接

首先点左侧边栏的「远程资源管理器」之,然后再点击「设置按钮」,进入远程机器配置界面。

c5d0c7ba-a680-11eb-aece-12bb97331649.png

机器配置

修改 ssh 配置文件,用于登录远程机器,各项含义在图中有说明。

c5f71ece-a680-11eb-aece-12bb97331649.png

SSH配置文件

点击连接,登录远程服务器,需要输入几次远程服务器的密码(后面会教你怎么免密登录),输入确认即可。第一次连接会做VS Code Server的初始化工作比较慢,耐心等待。

c6083f4c-a680-11eb-aece-12bb97331649.png

登录远程服务

登录成功,即可像操作本地环境一样,在VS Code客户端操作远程云主机上的文件。注意,下图中的「打开文件夹」已经是远端机器上的目录结构了。

c61b1bbc-a680-11eb-aece-12bb97331649.png

打开远程目录

给远程VS Code 安装插件。安装的插件是在云服务器的VS Code上,对本机的VS Code没有影响,插件在远端提供功能,比如代码审查、自动补齐等等,而这所有的一切就像在本地操作一样,对文件的更改也是直接操作的云主机上的文件,丝滑连接。

c649d768-a680-11eb-aece-12bb97331649.png

本地插件和远程插件

代码编辑与远程终端调试。打开文件编辑的是云服务器的文件,同时可以打开云服务终端,直接在终端操作编译或者查看云服务器信息。

c65e450e-a680-11eb-aece-12bb97331649.png

远程编辑和调试

配置SSH免密登录按照上面的配置步骤,每次连接到远程服务器,都需要输入服务器登录密码很麻烦,可以配置SSH免密登录,免去每次输入密码的烦恼,具体操作步骤如下:

打开win cmd终端,输入 ssh-keygen -t rsa 生成秘钥对

c68d0ace-a680-11eb-aece-12bb97331649.png

秘钥列表

打开生成的秘钥保存路径,拷贝 id_rsa.pub 内容,添加到到云服务器的 ~/.ssh/authorized_keys 文件后面。

尝试再次连接,不用输密码了,enjoy!

4最后

这套远程开发环境最大的好处是不用给电脑装太多软件,即使是电脑配置低点都没关系,因为所有的编辑器插件扩展和代码都在云端,通过 SSH 连接操作一个VS Code打遍所有。

而且由于远程开发插件的存在,不论我在哪里,只要有电脑都能方便的打开云端开发环境,非常的方便,这么好用的工具大幅提升生产力,所以今天来分享给大家。
编辑:lyn

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • Linux
    +关注

    关注

    88

    文章

    11628

    浏览量

    217989
  • Win10
    +关注

    关注

    2

    文章

    710

    浏览量

    42128
  • vscode
    +关注

    关注

    1

    文章

    171

    浏览量

    9007
  • 远程办公
    +关注

    关注

    0

    文章

    76

    浏览量

    6808

原文标题:手把手教你VS Code 实现远程开发的配置方法

文章出处:【微信号:strongerHuang,微信公众号:strongerHuang】欢迎添加关注!文章转载请注明出处。

收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    VS Code 中`xiaozhi-esp32` 项目文件夹 修改 I2C 设备地址为 `0x78`

    VS Code 中`xiaozhi-esp32` 项目文件夹 修改 I2C 设备地址为 `0x78`
    的头像 发表于 11-28 07:30 528次阅读

    使用vscode和cmake工具开发极海G32R501 MCU

    目前极海官方提供的 IDE 开发环境有 Keil/IAR/Eclipse。都能很好的完成开发,但是 VS Code 配合 CMake 工具是更加“现代”的C/C++
    的头像 发表于 11-25 14:45 2678次阅读
    使用vscode和cmake工具<b class='flag-5'>开发</b>极海G32R501 MCU

    VS Code运行 pytest_hello_world.py

    VS Code运行 pytest_hello_world.py
    的头像 发表于 11-24 00:33 343次阅读

    如何在VS code配置Zephyr集成开发环境

    上一篇文章介绍了如何在VS code中使用瑞萨官方插件为RA芯片创建项目与项目调试,相信大家对RA在VS code中的开发有了基础的了解。
    的头像 发表于 11-05 14:46 1079次阅读
    如何在<b class='flag-5'>VS</b> <b class='flag-5'>code</b>中<b class='flag-5'>配置</b>Zephyr集成<b class='flag-5'>开发</b>环境

    NRF54L15芯片开发安装路径对vscode不生效问题解析

    在使用 NRF54L15 开发时,若通过nrfutil toolchain-manager命令行设置的 SDK 和工具安装路径在 D 盘,但 VS Code 中安装工具链仍默认到 C 盘,可能是
    发表于 10-31 13:04

    睿擎平台网络开发指南:从IP配置远程控制 | 技术解析

    在工业物联网和嵌入式系统开发中,网络功能是连接设备、实现远程控制和数据传输的核心基础。睿擎工业开发平台提供了全面的网络开发支持,包括灵活的I
    的头像 发表于 10-22 17:13 6022次阅读
    睿擎平台网络<b class='flag-5'>开发</b>指南:从IP<b class='flag-5'>配置</b>到<b class='flag-5'>远程</b>控制 | 技术解析

    SEGGER工具链集成到CMake和VS Code

    SEGGER公司已将其嵌入式开发工具链集成到了广泛使用的CMake构建配置工具中,这意味着基于Visual Studio CodeVS Code
    的头像 发表于 07-23 15:06 778次阅读

    软件平台的使用(SC171开发套件V3)

    .rar 4 VS code远程连接指南 8分31秒 https://t.elecfans.com/v/27884.html *附件:文档:VS C
    发表于 04-16 17:25

    如何在VS Code中使用瑞萨RA系列MCU

    VS Code(Visual Studio Code)是微软公司出品,它是一个免费且多功能的代码编辑器,几乎支持所有主要的编程语言和框架。特别是最近又新加了Github Copilot功能,让用户
    的头像 发表于 04-16 14:02 3297次阅读
    如何在<b class='flag-5'>VS</b> <b class='flag-5'>Code</b>中使用瑞萨RA系列MCU

    Nordic蓝牙开发不用Keil用VS code了?

    开发工具VS Code IDE插件完成产品一站式编译、烧录等开发 nRF Connect SDK 是一款现代、统一的软件开发工具包,用于
    发表于 03-05 16:41

    怎么配置dlp6500二次开发的环境,可以使用VS2013吗?

    我想请问一下,怎么配置dlp6500二次开发的环境,可以使用VS2013吗?有没有什么可以参考的文件,感谢!
    发表于 02-28 06:39

    设备远程维护如何实现远程维护平台的功能特点

    随着工业智能化和数字化转型的快速推进,设备远程维护已成为企业提升运营效率、降低维护成本的重要手段。通过远程维护平台,企业能够实时监控设备状态,快速响应故障,实现设备的高效管理和维护。本文将详细
    的头像 发表于 02-21 15:50 1133次阅读
    设备<b class='flag-5'>远程</b>维护如何<b class='flag-5'>实现</b>?<b class='flag-5'>远程</b>维护平台的功能特点

    使用MCUXpresso for VS Code插件开发Zephyr的hello world

    本期来到Zephyr实战经验演练,小编带着大家一起使用MCUXpresso for VS Code插件来开发一个属于Zephyr的hello world。
    的头像 发表于 01-03 09:21 1783次阅读
    使用MCUXpresso for <b class='flag-5'>VS</b> <b class='flag-5'>Code</b>插件<b class='flag-5'>开发</b>Zephyr的hello world

    Zephyr领进门系列:MCUXPresso for VS Code插件安装

    一套PC端的Zephyr OS开发环境。话不多说,开整! 1.  安装VS Code 相信不少小伙伴已经将VS Code当作装机必备工具了,
    的头像 发表于 12-19 09:53 2750次阅读
    Zephyr领进门系列:MCUXPresso for <b class='flag-5'>VS</b> <b class='flag-5'>Code</b>插件安装

    IAR升级VS Code调试扩展,引入Listwindow技术

    IAR近日宣布对VS Code中的调试扩展IAR C-SPY调试器进行了重要升级。此次升级的核心亮点在于引入了IAR独有的Listwindow技术,为嵌入式设备调试设立了新的标杆
    的头像 发表于 12-11 11:15 1099次阅读