如何调试 .NET MAUI Blazor 混合 Windows UI答案

【问题标题】：How to Debug .NET MAUI Blazor Hybrid Windows UI如何调试 .NET MAUI Blazor 混合 Windows UI
【发布时间】：2022-06-17 05:37:16
【问题描述】：

我基本上来自 Web 背景并尝试 .NET MAUI Blazor Hybrid。我在 .NET MAUI Window 的开发过程中遇到了错误，不知道如何调试它？我查看了所有类型的窗口，但在任何地方都找不到错误详细信息。

我尝试过调试，但这很令人头疼，因为它会长时间进入循环。

【问题讨论】：

由于某种原因 F12 工具无法正常工作，但似乎我现在可以看到所有错误详细信息

标签： maui-blazor

【解决方案1】：

您必须确保已激活 WebDev 工具。 Browser developer tools with .NET MAUI Blazor

确保将 Blazor Hybrid 项目配置为支持浏览器开发人员工具。您可以通过搜索应用程序来确认开发者工具支持 AddBlazorWebViewDeveloperTools

如果项目尚未针对浏览器开发人员工具进行配置，请通过以下方式添加支持：

定位到调用 AddMauiBlazorWebView 的位置，可能在应用的 MauiProgram.cs 文件中。

在调用AddMauiBlazorWebView之后，添加以下代码：

#if DEBUG
    builder.Services.AddBlazorWebViewDeveloperTools();
#endif

在 Windows 应用中使用浏览器开发者工具：

运行适用于 Windows 的 .NET MAUI Blazor 应用并导航到使用 BlazorWebView 的应用页面。
使用键盘快捷键Ctrl+Shift+I打开浏览器开发工具。

【讨论】：

【解决方案2】：

有一种方法可以使用浏览器开发工具 (F12) “远程检查”您的应用。首先，检查您是否在MauiProgram.cs 中添加了builder.Services.AddBlazorWebViewDeveloperTools(); 运行您的应用程序并在浏览器中打开一个新选项卡（在模拟器之外）并输入：

对于 Chrome：chrome://inspect
对于 Edge：edge://inspect

稍等片刻，您将看到一个“检查”按钮，如下所示：

您甚至可以从那里在您的应用中导航：

【讨论】：