我构建了一个 VSCode 扩展:ngrok for VSCode

2025-06-07

我构建了一个 VSCode 扩展:ngrok for VSCode

复活节周末,全球各地都处于封锁状态,为期四天,我决定利用在家的额外时间启动一个新项目并学习一项新技能。周末结束时,我自豪地发布了我的第一个 VSCode 扩展:ngrok for VSCode

那现在是什么?

ngrok是由Alan Shreve构建的一款命令行工具,可用于将本地服务器暴露给外部访问的 URL。它非常适合用于共享访问您自己机器上运行的应用程序、在移动设备上测试 Web 应用程序或测试 Webhook 集成。例如,在使用 Twilio 应用程序时,我非常喜欢使用 ngrok 来测试我的 Webhook 。

VSCode是我目前最喜欢的文本编辑器,由微软构建,基于 JavaScript(嗯,主要是 TypeScript)。

上周我使用 VSCode 的时候,一直在想有没有一个扩展可以更方便地使用 ngrok。我搜索了一下,找到了一个正在开发中的扩展,还有一个可以启动 Web 服务器并运行 ngrok 的扩展。于是,我决定构建一个我想在市场上看到的扩展。

它起什么作用?

使用扩展版本 1,您可以使用端口号或从ngrok 配置文件中选择一个命名隧道来启动 ngrok 隧道。有一个可用设置,您可以在其中设置配置文件的自定义路径。

一旦隧道运行,您就可以打开ngrok 仪表板或关闭隧道。

所有命令都可以从 VSCode 命令面板中获得。

到目前为止它很简单,但我想保持较小的范围并将其发布。

显示使用 VSCode 命令面板中的扩展的动画。

代码全部开源,您可以在 GitHub 上找到

下一步是什么?

我非常欢迎您尝试一下这个扩展,尤其是如果您已经是 ngrok 用户的话。如果它有用,我期待您的反馈、错误报告和功能请求,以便我能够继续改进它。

我已经有了一个想法,那就是提供一个状态栏项树状视图,以便提供更多关于当前正在运行的 ngrok 隧道的信息和控制。我可能也应该研究一下如何为这个扩展编写测试。

你怎么认为?

我确实在寻求反馈,所以请为 VSCode安装ngrok 并通过Twitter或VSCode Marketplace 上的评论告诉我您的想法

文章来源:https://dev.to/philnash/i-built-a-vscode-extension-ngrok-for-vscode-29f7
PREV
Rails 6 将包含新的 Action Text 框架
NEXT
如何不对 JavaScript 中的数组进行排序