VS Code 打造个人超级工作站

语言: CN / TW / HK

效果演示

image.png

个人工作是 Web 前端,偶尔使用 Python,最近在学习 Go 、Rust、区块链技术栈,偶尔也做个人应用服务器运维,这些场景 VSCode 都能比较理想的 cover 。并且随着 VSCode 迭代周期的加快,以及配置同步功能的官方支持,VSCode 已经逐渐成为个人最喜欢的应用程序没有之一。

插件强大,一站式集成开发

早年在学校写 Java Web 时,都至少再常备 Navicat , Postman 这样的客户端进行 Dev 。这些功能都能使用 VSCode 插件来平替:

https://marketplace.visualstudio.com/items?itemName=rangav.vscode-thunder-client 类似 PostMan

https://marketplace.visualstudio.com/items?itemName=mtxr.sqltools 类似Navicat

https://marketplace.visualstudio.com/items?itemName=tahabasri.snippets 可视化的代码 Snippets

https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens 显示每一行的 Git 提交信息

剩下的就是各语言技术栈常用的插件,大伙都知道,就不 listing 了。

内置于 VSCode 的插件其实可以类比于“小程序”。相对 Navicat 这种,节省掉一个客户端,并且和VSCode 共享用户状态和同步的应用状态,毫无疑问是更加方便的。

官方 Setting Sync

以往的 VSCode Setting sync 可以靠插件实现,但或多或少都有些问题。最近官方终于支持了 setting sync 功能,相当的王炸。

https://code.visualstudio.com/docs/editor/settings-sync

使用 Github 登录即可使用,同步极为细致,如图可见。最关键的是插件状态也能很好的同步。像 https://marketplace.visualstudio.com/items?itemName=tahabasri.snippets 这个插件存储的代码片段也在 extension.json 文件里,则也走这个同步。

我们如果使用上述 VSCode 插件替换掉日常使用的 Navicat 等客户端,再结合同步功能,可以说便利性更上了一个台阶。在一台新到手的机器上,我只用下载 VSCode,登录 github 开启同步,则一百多个插件及其状态几分钟即可同步完成,瞬间完成开发环境配置,可以说相当的恐怖。

Remote - 不止运维,更是 Development

上面说瞬间完成新设备的开发环境配置其实不对,因为具体的开发环境还没装,配置完成的其实是 IDE 等应用程序的状态。

https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.vscode-remote-extensionpack

最初个人接触到 Remote 套件时是想找个运维的解决方案,使用 VSCode ssh 到远程服务器,像编辑本地文件一样编辑服务器文件。但时至今日 Remote Development 已经相当普遍。我们可以默认只使用一个固定的远程服务器进行开发,代码也放在远程服务器上做 Dev 环境运行。

实际上 github 的 codespace https://github.com/codespaces 就是这样,只不过每个 codespace 都是一个单独的机器(ip),默认通过浏览器打开但比较卡,也无法做到上百个插件的快速初始化,而如果选择通过本地 IDE打开,本质上和直接本地用 VSCode remote 特定服务器一样。

(吐槽:github 的 codespace 居然是按时间收费的,定时还会断开,真不如直接买个国内云厂商便宜的轻量应用服务器当开发机)

(上两图一样)

而许多互联网大厂内部 codebase 或 cloud IDE 往往是一个独立的大部门,codespace 这块实际上都有内部的产品, Remote Dev 现在也直接加入了研发新人的 Landing 流程作为默认开发配置。

每个研发新人默认发一个四核8g 的开发机,一个内网 ipv6 地址。假如内部默认使用的设备还是 19款或更老款的破烂 MBP, Remote Dev 也能极大的拯救电脑流畅度,因为 Dev 运行都在远程开发机上。

端口转发

remote dev 时起本地服务,比如 localhost:8000 , 是远程服务器的8000 端口,并非本机的。但 VSCode 默认已经做了转发,见 https://code.visualstudio.com/docs/remote/ssh#_forwarding-a-port-creating-ssh-tunnel 本机localhost:8000 直接打到远程,开发体验基本一致。

但在某些情况下会有差异,比如前端开发时,访问 localhost:8000 实际上相当于在访问远程服务器的资源(相对于纯本地开发访问本地资源),假如静态资源较大,传输速度可能受到远程服务器网络的限制。但如果都在公司内网则这一点就不存在问题。

Remote Dev 优势

综上 Remote Dev 已有明显的优势: - 不用频繁提代码。今天写完 cmd + s , 明天 remote 到开发机接着写,纯本地机器总有物理消灭的风险,远程开发机的安全性和代码仓库服务器也基本一致 - 拯救机器硬件,如老款 MBP - 多设备都同时使用 Remote 一台稳定的开发机进行开发,舒适度大于多设备分别下载代码本地开发

总结

Remote Dev 再结合上文的 Setting Sync ,以及插件优势,真正做到了任何一台新设备,下载 VSCode,开启Setting sync ,Remote 开发机,即可获取完整的开发体验。

个人实践上购买了国内云厂商的便宜应用服务器作为开发机使用,在公司也能 remote 开发机学习实践新知识,回家则继续家用机 remote 到开发机无缝切换。因此 VSCode 已经成为个人的超级工作站,任何 Dev 需求能用 VSCode 满足的,都会尽量使用 VSCode 来满足。VSCode 已经成为个人最喜欢的应用程序,希望它也能成为你最喜欢的应用程序。

写文章本身也是一个学习的过程,也请读者能指出文章中的疏忽错漏之处。如果本文对你有所帮助,欢迎点赞收藏。