1.主进程调试，似乎无法热重载

浏览器调试

尝试了在packge.jsont添加命令：

    "debug": "electron --inspect=5858 .",
    "debug2": "./node_modules/.bin/electron ./src/main/index.mjs --inspect",

运行也只是在编译后的结果上调试

vscode调试

launch.js里添加debug的配置

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Main",
      "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
      "runtimeArgs": ["--remote-debugging-port=9222", "."],
      "windows": {
        "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
      }
    },
    {
      "name": "Renderer",
      "type": "chrome",
      "request": "attach",
      "port": 9222,
      "webRoot": "${workspaceFolder}"
    }
  ],
  "compounds": [
    {
      "name": "All",
      "configurations": ["Main", "Renderer"]
    }
  ]
}

生产环境调试

生产环境的情况比开发环境要复杂一些。一般来说，我们希望有一个入口可以打开 devtools，以便在出现问题的时候能够方便调试；而另一方面，这个入口与产品本身无关，我们希望它对用户隐藏。一个比较常见的方案是：指定一套私有的快捷键，监听对应事件并在回调中调用 JavaScript API 来打开 devtools，并将快捷键设置为复杂的组合，以降低用户误触的概率。

快捷键方案确实有一定可行性，不过并没有从根本上解决这个问题。所以这里推荐使用 Debugtron 进行调试。Debugtron 是一个调试生产环境 Electron 应用的工具，无需在客户端集成任何代码。它本身也基于 Electron 构建，支持多个平台。

下载最新版本安装并打开 Debugtron 后，会检测并展示所有已安装的 Electron 应用：