方法1：利用浏览器开发者工具（桌面/网页版通用） #

• Excel网页版：直接按F12打开开发者工具，切换到Console标签。对话框弹出后，在工具的Frames下拉菜单里选中对话框对应的页面（对应你的插件域名），就能查看该页面所有console.log输出，还能设置断点逐步调试代码。
• Excel桌面版：用Edge DevTools附加到Excel插件进程：
  1. 打开Excel并加载插件，弹出目标对话框。
  2. 打开Edge浏览器，输入edge://inspect，找到Excel进程下的插件对话框页面，点击Inspect打开调试工具，即可查看日志、设置断点调试。

方法2：通过消息传递转发日志到主插件页面 #

借助Office.js的Dialog通信API，把对话框的日志发送到主插件页面（主页面的控制台可正常查看）：

• 对话框页面（MyFunctions.html）的JS中，给console.log补充消息发送逻辑：

  // 示例：将日志发送到主页面
  function logToMain(message) {
    console.log(message); // 保留原日志，同时发送到主页面
    Office.context.ui.messageParent(`[Dialog Log]: ${message}`);
  }
  
  // 替换原有console.log调用，比如：
  logToMain("Office JS加载前执行");
  

• 主插件页面的JS中添加消息监听：

  Office.onReady(() => {
    Office.context.ui.addHandlerAsync(Office.EventType.DialogMessageReceived, (args) => {
      console.log(args.message); // 主页面控制台可看到对话框日志
    });
  });
  

方法3：VS Code直接调试插件 #

通过VS Code配置调试环境，直接附加到Excel进程：

1. 安装Office Add-ins Debugger扩展。
2. 在项目根目录创建.vscode/launch.json，配置示例：

   {
     "version": "0.2.0",
     "configurations": [
       {
         "name": "Excel Desktop (Edge Chromium)",
         "type": "office-addin",
         "request": "attach",
         "url": "https://localhost:3000/taskpane.html",
         "runtime": "exceldesktop",
         "webRoot": "${workspaceRoot}"
       }
     ]
   }
   

3. 启动Excel并加载插件，在VS Code中启动调试，即可在对话框页面设置断点，查看变量、日志输出，逐步调试代码。

内容的提问来源于stack exchange，提问作者Rahul Deshpande