Azure devops 如何轻松快速地调试Azure Devops仪表板小部件?

Azure devops 如何轻松快速地调试Azure Devops仪表板小部件?,azure-devops,widget,dashboard,vsix,Azure Devops,Widget,Dashboard,Vsix,我正在为Azure Devops仪表板编写一个仪表板小部件,我发现在Chrome工具刷新页面中修改发布刷新仪表板设置断点的周期再次变得相当乏味 有没有一种方法可以直接在VisualStudio或VS代码中测试或调试仪表板小部件 我正在使用作为我的小部件的起始模板-很高兴更改 您可以在本地开发。由于Azure DevOps使用iframe来显示扩展的内容,因此您可以运行本地服务器并在vss extension.jsonmanifest中引用它 默认情况下,启动开发人员工具时,开发人员控制台位于主页

我正在为Azure Devops仪表板编写一个仪表板小部件,我发现在Chrome工具刷新页面中修改发布刷新仪表板设置断点的周期再次变得相当乏味

有没有一种方法可以直接在VisualStudio或VS代码中测试或调试仪表板小部件


我正在使用作为我的小部件的起始模板-很高兴更改

您可以在本地开发。由于Azure DevOps使用iframe来显示扩展的内容,因此您可以运行本地服务器并在
vss extension.json
manifest中引用它

默认情况下,启动开发人员工具时,开发人员控制台位于主页面或顶部窗口的上下文中。换句话说,您可以访问顶部窗口的DOM和状态。使用“目标”下拉列表(如上所示)将上下文切换到扩展的框架。现在可以访问扩展框架的DOM和全局状态

此外,您还可以使用官方扩展

此存储库演示如何加载Azure DevOps扩展的 直接从开发人员机器上编写代码,而不是捆绑所有代码和 通过市场部署它。我们将在一定程度上利用 Azure DevOps中隐藏的)从本地主机加载内容的功能, 这将使我们能够在VS代码中使用热重新加载和调试

更多详细信息和方式,请参考以下链接:


谢谢Patrick-这是一个极好的答案,应该被认为是开始使用devops扩展的标准答案!