测试和调试

为了改善开发人员体验,Docker Desktop 提供了一组工具来帮助您测试和调试扩展。

打开 Chrome 开发者工具

为了在选择扩展选项卡时打开扩展程序的 Chrome 开发者工具,请运行:

$ docker extension dev debug <name-of-your-extensions>

随后每次单击扩展选项卡也会打开 Chrome DevTools。要停止此行为,请运行:

$ docker extension dev reset <name-of-your-extensions>

部署扩展程序后,还可以使用 Konami 代码的变体从 UI 扩展部分打开 Chrome DevTools 。选择“扩展”选项卡,然后按按键序列up, up, down, down, left, right, left, right, p, d, t

开发 UI 时热重载

在 UI 开发过程中,使用热重载来测试您的更改而不需要重建整个扩展会很有帮助。为此,您可以配置 Docker Desktop 以从开发服务器加载您的 UI,例如 使用 调用时启动的Vitenpm start

假设您的应用程序在默认端口上运行,启动您的 UI 应用程序,然后运行:

$ cd ui
$ npm run dev

这将启动一个侦听端口 3000 的开发服务器。

您现在可以告诉 Docker Desktop 使用它作为前端源。在另一个终端中运行:

$ docker extension dev ui-source <name-of-your-extensions> http://localhost:3000

关闭并重新打开 Docker Desktop 仪表板,然后转到您的扩展。对前端代码的所有更改都会立即可见。

完成后,您可以将扩展配置重置为原始设置。如果您使用了以下命令,这也会重置 Chrome DevTools 的打开状态docker extension dev debug <name-of-your-extensions>

$ docker extension dev reset <name-of-your-extensions>

显示扩展容器

如果您的扩展由在 Docker Desktop VM 中作为容器运行的一项或多项服务组成,您可以从 Docker Desktop 中的仪表板轻松访问它们。

  1. 在 Docker Desktop 中,导航至“设置”
  2. “扩展”选项卡下,选择“显示 Docker 桌面扩展系统容器”选项。您现在可以查看扩展容器及其日志。

清理

要删除扩展,请运行:

$ docker extension rm <name-of-your-extension>

下一步是什么