当前位置: 首页 > 科技观察

Github代码空间服务初尝——在线VSCode

时间:2023-03-14 16:00:54 科技观察

Github近日内测了一款新的秘密武器代码空间服务,这是一款支持VisualStudioCode的在线浏览器集成开发环境。该服务允许用户快速加载虚拟机和完整的集成开发环境(IDE),用户只需通过浏览器编辑和调试代码,并支持常见语言的调试。Codespace包括为特定存储库开发所需的一切,包括具有语法突出显示和自动完成功能的文本编辑器、终端、调试工具和Git命令,所有这些都集成在GitHub中。您还可以在CodeSpace中安装VisualStudioCode扩展以添加更多功能。使用Gitlab的同学可能用过Gitlab的WebIDE。Github代码空间的使用与此类似,但基于VSCode,体验可能会更好。目前该服务处于Beta内测阶段,需要您发送请求申请内测,审核通过后方可试用。最初,GitHub代码空间与仓库密切相关。获得内测资格后,在仓库右侧的项目概览部分有一个按钮“OpenwithCodespaces”。打开此按钮以编辑代码。无需任何额外配置即可立即在线工作。您也可以通过Github页面顶部的顶级菜单Codespaces打开代码空间。然后选择具体项目打开:代码空间加载需要一段时间。GitHub代码空间界面是典型的VSCode界面,左侧有活动栏、侧边栏、编辑栏、面板栏和状态栏。很明显,它是基于VisualStudioCode的,或者说是典型的深色模式。整个界面包含了您期望从浏览器获得的所有标准功能,例如语法突出显示、ViM和Emac绑定(在浏览器中运行良好)以及默认启用的自动保存。您还可以将文件从本地计算机拖放到Codespaces文件系统中,并在浏览器中预览和编辑某些非文本文件,例如图像,这两种方式对于Web开发都非常方便。TerminalEmulatorGitHub代码空间包括一个功能强大的终端编辑器,它似乎是基于Debian映像的。使用下拉菜单而不是选项卡来访问各个终端。而且重要的是,Docker也可以在这个终端下运行。能够在浏览器中简单地运行Docker很棒。默认情况下,Docker-compose是没有安装的,目前我们还不知道它的工作模式,以后可以了解。我在终端模拟器中发现的唯一问题是只能通过右键单击将其粘贴到基于Chromium的浏览器(例如Chrome或Edge)中,Firefox似乎不能。代码转发端口转发使我们能够访问在代码空间中运行的TCP端口。例如,如果您在端口3000上运行一个Web应用程序,您可以从浏览器访问该应用程序以对其进行测试和调试。Github代码空间在处理端口转发方面做得很好,当在代码空间内运行的应用程序将端口输出到控制台时,代码空间将检测本地主机URL模式并自动转发这些端口。您可以通过在终端中单击URL在浏览器中打开它。比如应用输出http://127.0.0.1:3000或者输出http://localhost:3000到控制台,就会自动输出日志。如果GitHub检测到localhost:PORT组合,可以通过点击URL访问,如下图:Jekyllloadsandreloadsquicklyintheexample,当点击一个转发的链接或切换标签预览站点的变化时,它会刷新地点。这个功能只支持Chromium的功能,在Firefox中好像有问题。可以通过触发命令选项板(shift+command+P或shift+control+P)并键入“代码空间:转发端口”来按需转发端口。然后,您可以输入要转发的端口号。您还可以通过.devcontainer.json文件中的forwardPorts属性配置转发端口。“RemoteExplorer”扩展支持添加或删除转发端口,您可以复制粘贴转发端口的URL,在浏览器中通过该Url访问即可。总而言之,这是一个很棒的功能,可以帮助那些不是很擅长在线开发的开发人员。专业的开发者也可以偶尔用它来进行紧急代码调试,这样就不用时不时带着笨重的笔记本了。此外,GitHub代码空间还有协同工作区、Git集成、与本地版VisualStudio连接等诸多功能。我们还需要一起探索和学习。