如何使 VS Code 可重现地调试 Electron App？答案

【问题标题】：How to make VS Code debug Electron App reproducibly?如何使 VS Code 可重现地调试 Electron App？
【发布时间】：2021-01-07 02:19:45
【问题描述】：

我使用Electron React Boilerplate 创建了一个内置热重载、Typescript、Crossenv、Webpack、Babel、React devTools 和 vscode 调试配置的应用程序。

问题：如何让 VSCode 以可重复的方式附加/调试此应用程序？我已经发布了一个 github 问题 here，其中包含调试和配置不一致的示例。

为了完整起见，这里是我项目中当前的相关设置：

package.json

...

  "scripts": {
    ...
    "start": "cross-env NODE_ENV=production electron ./app/main.prod.js",
    "start-main-debug": "yarn start-main-dev --inspect=5858 --remote-debugging-port=9223",
    "start-main-dev": "cross-env START_HOT=1 NODE_ENV=development electron -r ./internals/scripts/BabelRegister ./app/main.dev.ts",
    "start-renderer-dev": "cross-env NODE_ENV=development webpack-dev-server --config configs/webpack.config.renderer.dev.babel.js",
  },
...

launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Electron: Main",
      "protocol": "inspector",
      "runtimeExecutable": "yarn",
      "runtimeArgs": ["start-main-debug"],
      "preLaunchTask": "Start Webpack Dev"
    },
    {
      "name": "Electron: Renderer",
      "type": "chrome",
      "request": "attach",
      "port": 9223,
      "webRoot": "${workspaceFolder}",
      "timeout": 15000
    }
  ],
  "compounds": [
    {
      "name": "Electron: All",
      "configurations": ["Electron: Main", "Electron: Renderer"]
    }
  ]
}

环境

Node version : 14.11.0
VSCode version: 1.49.1
electron-react-boilerplate version or branch : 1.3.0
Operating System and version : Darwin 10.15.5

与样板文件中相同的其他文件，例如 main.dev.ts

【问题讨论】：

标签： node.js debugging visual-studio-code electron vscode-debugger

【解决方案1】：

作为临时解决方案，我只是终止进程并清除断点，然后重新启动/重置。这会命中所有断点，但这样做的方式有点不确定......

如果其他人有更好的解决方案，绝对愿意接受！

【讨论】：

您找到更好的解决方案了吗？
@BarisLaPaz 不，仍在杀死和清除断点...由于所有设置的痛苦和不一致，我实际上已经切换到带有源映射的浏览器调试器