vscode 如何断点调试 electron 程序？主进程 attach 调试

我们相信：世界是美好的，你是我也是。平行空间的世界里面，不同版本的生活也在继续...

对于vscode调试electron这件事来说，区别于9222端口的渲染进程调试方式，这里存在着一个5858端口的主进程调试方案。这个5858端口方案的调试，是非常的与众不同，与以往的electron的调试方案差别很大。本文，就着重说一下这个electron的5858主进程方案是如何使用的。

本文测试环境：mac/electron3.0.7/vscode1.30.1

配置.vscode/launch.json

.vscode/launch.json文件配置如下：

其中的sourceMaps建议设置为true，可以用于调试es6的代码。被注释掉的几条设置，貌似也没什么用，而且添加上总是有报错。

命令行启动electron

最正确的命令方式是：

./node_modules/.bin/electron --inspect-brk=5858 ./

会有如下提示信息：

Debugger listening on ws://127.0.0.1:5858/8885afaa-a26b-4a19-9ac0-693b0aec8d32
For help, see: https://nodejs.org/en/docs/inspector

其中关于--inspect-brk，会有其他的表述。

• 比如：--debug、--debug-brk。这两个是废弃的参数，新版的electron早就不支持这2个参数了。
• 而--inspect和--inspect-brk的区别就在于：--inspect-brk是必须attach后，f5一下才进入调试的。--inspect并不是。

vscode执行attach

执行定义在.vscode/launch.json中的attach，进入调试模式。如果使用的是--inspect-brk的话，需要先按一下f5，才能继续。调试的时候，对于使用了es6的代码，需要先babel，然后生成sourceMap，然后配置sourceMaps为true，才能正常调试。这个思路可以参见苏南大叔的前几篇文章。

注意：主动按f5!

vscode停止调试

常规的vscode停止调试，在这个方案中是不起作用的。仅仅是停止了attach而已，electron程序自身还存在，需要在命令行里面使用ctrl+c才能停止这个被调试的electron程序。

总结

vscode和electron的故事，讲了这么多，基本上也算可以告一段落了。electron-vue的调试，基本上也逃不出这个范围，关键点就这么几个：babel，sourcemap。其余的，采用那种调试方案，这个就是仁者见仁智者见智的事情了。

使用attach方案的时候，根本不关心是不是es6，是不是需要babel，执行的是哪个文件。因为，那是另外开启的命令行所考虑的事情，在.vscode/launch.json中是并不体现这些设置信息的。

更多electron的经验文字，苏南大叔提示您：请点击下面的链接查看。

• https://newsn.net/tag/electron/

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。