VS Code 远程开发配置笔记

时间 2021-03-09

标签前端 node nginx git bash 服务器 ssh 工具开发工具 spa 栏目 Nginx 繁體版

原文原文链接

对前端来讲，VS Code简直就是宇宙最强开发工具，配合各类插件，能够知足咱们各类项目的开发需求。可是每当切换工做环境，就须要花很长时间去作环境的搭建或者是同步，即使代码能够同步到git仓库，但不少时候并不想把没有完成的代码给提交到仓库里，形成提交记录污染。因此远程开发的模式，就成了迫切的提升生产力的需求。前端

VS Code的Remote-SSH插件就提供了这样的能力，且配置很是简单。

本文就记录了一个完整的配置过程，分为两个部分，本地配置部分和远程配置部分node

远程配置

一、先搞一台云服务器nginx

仅我的开发的话1核2G足矣，腾讯云便宜点，镜像能够用CentOS 8的。

二、安装一些必要的依赖git

例如git、node、yarn、nginx等，最主要是git，具体安装步骤写到后面

三、生成ssh-key，供免密用bash

ssh-keygen，一路回车

四、克隆项目。远程配置暂告一段落。服务器

本地配置

一、安装Remote-SSH插件ssh

会搜到三个结果
Remote - SSH - 经过使用 SSH 连接虚拟或者实体Linux主机。
Remote - Containers – 链接 Docker 开发容器。
Remote - WSL - 链接 Windows Subsystem for Linux （Linux子系统）。
装一个就全装上了，咱们其实只须要ssh的这个
![image](/img/bVcPm9Z)

二、配置资源管理器工具

安装好之后，左侧栏会多出一个图标，远程资源管理器，点击之后，选择SSH Targets
![image](/img/bVcPnab)
而后进行配置
![image](/img/bVcPnaq)
Host名字随便起
HostName就是你的远程机器的eip
User默认root
![image](/img/bVcPnau)

三、链接远程服务器开发工具

配置完以后肯定，左侧targets里就出现了你的这台机器，而后点击开始链接
![image](/img/bVcPnbq)
输入密码，而后就能够看到远程目录了
![image](/img/bVcPnbE)

四、安装插件spa

本地的插件是不能直接在远程用的，须要额外再装一次
![image](/img/bVcPnbQ)

五、配免密登陆

打开本机的git bash，找到id_rsa.pub，复制内容
而后打开远程服务器终端，进到~/.ssh目录，touch一个authorized_keys文件（若是没有的话），把秘钥粘贴进去，保存
尝试再重启vscode，就ok了