使用 VSCode 调试电子锻造应用程序

Posted

技术标签:

【中文标题】使用 VSCode 调试电子锻造应用程序【英文标题】:Debug electron-forge app with VSCode 【发布时间】:2017-12-11 13:50:59 【问题描述】:

我正在尝试使用 VSCode(电子主进程,而不是渲染)调试我的电子锻造项目,但到处都出现错误。我安装了包含所有依赖项的 electron-forge 包并初始化了我的项目。

我遵循this 的指令,而我的 VSCode 的launch.json 是:


    "version": "0.2.0",
    "configurations": [
        
            "type": "node",
            "request": "launch",
            "name": "Electron Main",
            "runtimeExecutable": "$workspaceRoot/node_modules/.bin/electron-forge-vscode-win.cmd",
            "cwd": "$workspaceRoot"
        
    ]

但是当我在VSCode中点击F5进行调试时,我得到了Attribute "runtimeExecutable" does not exist,因为electron-forge是全局安装的,所以node_modules/.bin/目录中没有这样的文件。

然后根据this我改了"runtimeExecutable",我的launch.json如下:


    "version": "0.2.0",
    "configurations": [
        
            "type": "node",
            "request": "launch",
            "name": "Electron Main",
            "runtimeExecutable": "electron-forge-vscode-win.cmd",
            "cwd": "$workspaceRoot"
        
    ]

命令行是:

electron-forge-vscode-win.cmd --debug-brk=17423 --nolazy 
√ Locating Application
√ Preparing native dependencies
√ Launching Application

但仍然没有发生任何事情。我的电子应用程序启动了,但没有像 --debug-brk 参数所假设的那样停止。

接下来,我在launch.json 中添加了一行:


    "version": "0.2.0",
    "configurations": [
        
            "type": "node",
            "request": "launch",
            "cwd": "$workspaceRoot",
            "name": "Electron Main",
            "runtimeExecutable": "electron-forge-vscode-win.cmd",
            "protocol": "inspector"
        
    ]

使用此命令行启动:

electron-forge-vscode-win.cmd --inspect=11172 --debug-brk 
√ Locating Application
√ Preparing native dependencies
√ Launching Application

注意: 11172 是随机端口号

现在我收到了这个错误:Cannot connect to runtime process, timeout after 10000 ms - (reason: Cannot connect to the target: connect ECONNREFUSED 127.0.0.1:11172)

【问题讨论】:

【参考方案1】:

我得出的结论是,如果您使用 electron-forge 或 electron-compile,您将无法使用 VSCode 来调试主要的电子进程。在这两种情况下,VSCode 调试器都会忽略断点。 BrowserWindow 直接出现,在 VSCode 调试控制台窗口中出现以下消息:

Debugging with inspector protocol because a runtime executable is set.
c:\Users\paulk\OneDrive\dev\forge-debug/node_modules/.bin/electron.CMD --inspect=16988 --debug-brk .
Debugger listening on ws://127.0.0.1:16988/9cead160-c448-4b33-a8a2-2dff6f51ed59

有时当我关闭浏览器窗口时,“关闭所有窗口”事件处理程序中的断点会被命中。关闭窗口后,调试控制台中会出现以下消息:

Debugger attached.

也许这表明 VSCode 调试器直到 BrowserWindow 关闭后才附加。

我相信问题源于 eletron-forge 使用的电子编译。也许它与动态编译有关。

使用 VSCode 调试简单的 Electron 应用程序轻而易举。此外,普通 Electron 在调试器窗口中发出不同的消息:

Debugging with inspector protocol because a runtime executable is set.
c:\Users\paulk\OneDrive\dev\electron-quick-start/node_modules/.bin/electron.CMD --inspect=37884 --debug-brk .
Debugger listening on port 37884.
Warning: This is an experimental feature and could change at any time.

这表明普通 Electron 使用的连接调试器的方法与 electron-compile 不同。

很遗憾,electron-forge 不能与 VSCode 主进程调试一起使用。这对我来说毫无用处。此外,electron-forge 和 electron-compile 的开发人员似乎并不认为这是一个问题。了解 electron-forge 和 electron-compile 的开发人员以及这些软件包的用户使用哪些调试器来调试主进程代码会很有帮助。

【讨论】:

显然这是电子预编译编译(1.8.2-beta 3)使用的电子版本中的一个错误。见github.com/electron-userland/electron-forge/issues/…。【参考方案2】:

我相信你需要添加 "protocol"="legacy" 到您的启动配置。这是假设您使用的是 Node 版本

【讨论】:

【参考方案3】:

只需在协议后的launch.json 中添加【"port": 11172】

【讨论】:

以上是关于使用 VSCode 调试电子锻造应用程序的主要内容,如果未能解决你的问题,请参考以下文章

如何更改电子锻造默认端口?

如何在不使用电子锻造重定向到根目录的情况下进行热重装并做出反应

将 Visual Studio 调试器附加到电子应用程序

使用 VSCode 和 Docker 调试 PHP

VSCode - 如何使用启动配置调试启动自己的调试器的节点程序?

使用vscode开发一个flutter应用,但是停止调试在手机上打开应用后,加载了之前的版本