在 Microsoft Edge 中使用开发人员工具调试加载项

本文介绍如何在当前 IDE 外部调试外接程序 (JavaScript 或 TypeScript) 客户端代码。

使用 Microsoft Edge 开发人员工具调试任务窗格加载项

1. 旁加载 并运行加载项。

   注意

   若要在 Outlook 中旁加载加载项，请参阅 旁加载 Outlook 加载项进行测试。

2. 使用以下方法之一运行 Microsoft Edge 开发人员工具：

   • 确保加载项的任务窗格具有焦点，然后按 Ctrl+Shift+I。
   • 右键单击 (或选中并按住任务窗格) 打开上下文菜单并选择“ 检查”，或打开 “个性”菜单 并选择“ 附加调试器”。 (Outlook.) 不支持“个性”菜单

   注意

   新的 Outlook on Windows 桌面客户端不支持上下文菜单或键盘快捷方式来访问 Microsoft Edge 开发人员工具。 相反，必须从命令提示符运行 olk.exe --devtools 。 有关详细信息，请参阅 开发适用于新 Outlook on Windows 的 Outlook 加载项的“调试加载项”部分。

3. 打开“ 源 ”选项卡。

4. 使用以下步骤打开要调试的文件。

   1. 在工具顶部菜单栏的最右侧，选择“ ...” 按钮，然后选择“ 搜索”。
   2. 在搜索框中输入要调试的文件中的代码行。 它应该是任何其他文件中不太可能出现的内容。
   3. 选择“刷新”按钮。
   4. 在搜索结果中，选择行以在搜索结果上方的窗格中打开代码文件。

   

5. 若要设置断点，请在代码文件中选择行号。 代码文件中的 行会显示一个红点。 在右侧的调试器窗口中，断点在“ 断点” 下拉列表中注册。

6. 根据需要在加载项中执行函数以触发断点。

调试加载项中的对话框

如果外接程序使用 Office 对话框 API，则对话在任务窗格的单独进程中运行， (是否有任何) ，并且必须从该单独的进程启动该工具。 请按照以下步骤操作。

1. 运行加载项。

2. 打开对话框并确保其具有焦点。

3. 使用以下方法之一打开 Microsoft Edge 开发人员工具：

   • 按 Ctrl+Shift+I 或 F12。
   • 右键单击 (或选择并按住对话框) 打开上下文菜单，然后选择“ 检查”。

4. 使用与在任务窗格中使用代码相同的工具。 请参阅本文前面的 使用 Microsoft Edge 开发人员工具调试任务窗格加载项 。

自动打开 Microsoft Edge 开发人员工具以调试初始化

若要调试外接程序的初始化顺序，请配置环境，以便在加载项启动时自动打开Microsoft WebView2 开发人员工具。

1. 关闭计划调试加载项的 Office 应用程序。
2. 将 WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS 环境变量设置为包含值 --auto-open-devtools-for-tabs。
3. 打开 Office 应用程序。
4. 运行加载项。
5. 应自动打开Microsoft Edge 开发人员工具。 使用工具与调试任务窗格时相同，如 使用 Microsoft Edge 开发人员工具调试任务窗格加载项中指定的那样。