非常教程

Electron参考手册

指南·开发 | Guides: Development

在windows上调试 | Debugging on Windows

如果您认为Electron中的崩溃或问题不是由您的JavaScript应用程序引起的,而是由Electron本身引起的,那么调试可能有点棘手,特别是对于不习惯于本机/ C ++调试的开发人员。但是,使用Visual Studio,GitHub托管的Electron Symbol Server和Electron源代码,使用Electron源代码中的断点启用逐步调试相当容易。

要求

  • Electron的调试版本:最简单的方法通常是使用Windows版本说明中列出的工具和先决条件自己构建它。虽然您可以轻松地连接并调试Electron,但您可以直接下载它,但会发现它经过大量优化,使调试更加困难:调试器将无法向您显示所有变量的内容,并且执行路径可以由于内联,尾部调用和其他编译器优化而看起来很奇怪。
  • Visual Studio与C ++工具:Visual Studio 2013和Visual Studio 2015的免费社区版本都可以使用。安装完成后,将Visual Studio配置为使用GitHub的Electron Symbol服务器。它将使Visual Studio更好地理解Electron内部发生的事情,从而更容易以可读的格式显示变量。
  • ProcMon:免费的SysInternals 工具允许您检查进程参数,文件句柄和注册表操作。

附加和调试Electron

要启动一个调试会话,打开PowerShell / CMD并执行您的Electron调试版本,使用应用程序作为参数打开。

$ ./out/D/electron.exe ~/my-electron-app/

设置断点

然后,打开Visual Studio。Electron不是用Visual Studio构建的,因此不包含项目文件 - 但是,您可以打开源代码文件“As File”,这意味着Visual Studio将自行打开它们。您仍然可以设置断点 - Visual Studio会自动发现源代码与附加进程中运行的代码相匹配并相应地中断。

相关的代码文件可以在./atom/以及在./brightray/browser和找到的Brightray中找到./brightray/common。如果你是hardcore,你也可以直接调试Chromium,这显然是在chromium_src

附加

您可以将Visual Studio调试器附加到本地或远程计算机上正在运行的进程。进程运行后,单击调试/附加到进程(或按CTRL+ALT+P)以打开“附加到进程”对话框。您可以使用此功能调试在本地或远程计算机上运行的应用程序,同时调试多个进程。

如果Electron正在其他用户帐户下运行,请选中该Show processes from all users复选框。请注意,根据您的应用打开多少个BrowserWindows,您将看到多个进程。一个典型的单窗口应用程序将导致Visual Studio为您呈现两个Electron.exe条目 - 一个用于主流程,一个用于渲染器流程。由于名单只给你名字,目前没有可靠的方法来确定哪个是哪个名字。

我应该附加哪个过程?

在主进程中执行的代码(即在主JavaScript文件中找到或最终运行的代码)以及使用remote(require('electron').remote)调用的代码将在主进程内运行,而其他代码将在其各自的渲染进程内执行。

您可以在调试时附加到多个程序,但在任何时候只有一个程序在调试器中处于活动状态。你可以在Debug Location工具栏或者设置活动程序Processes window

使用ProcMon观察过程

虽然Visual Studio对于检查特定代码路径非常棒,但ProcMon的实力确实在于观察应用程序在操作系统上所做的一切 - 它捕获文件,注册表,网络,进程和分析进程的详细信息。它试图记录所有发生的事件,并且可能相当令人难以置信,但如果试图了解应用程序在操作系统中的作用和方式,它可能是一种宝贵的资源。

Electron

Electron 是一个使用 JavaScript, HTML 和 CSS 等 Web 技术创建原生程序的框架,它负责比较难搞的部分,你只需把精力放在你的应用的核心上即可。

主页 https://electron.atom.io/
源码 https://github.com/electron/electron
发布版本 1.7.9

Electron目录

1.指南 | Guides
2.指南·开发 | Guides: Development
3.Webview 组件 |
4.加速器 | Accelerator
5.API
6.API·对象 | API·Objects
7.app
8.autoUpdater
9.浏览器总览 | BrowserView
10.浏览器窗口 | BrowserWindow
11.浏览器窗口代理 | BrowserWindowProxy)
12.ClientRequest
13.剪贴板 | clipboard
14.内容追踪 | contentTracing
15.小型文字档案 | Cookies
16.crashReporter
17.调试器 | Debugger
18.desktopCapturer
19.dialog
20.电子下载 | DownloadItem
21.环境变量 | Environment Variables
22.无框窗口 | Frameless Window
23.globalShortcut
24.IncomingMessage
25.ipcMain
26.IPC渲染器 | ipcRenderer
27.语言环境 | Locales
28.画面 | Menu
29.MenuItem
30.本地图像 | nativeImage
31.net
32.通知 | Notification
33.权限监控 | powerMonitor
34.权限存储拦截器 | powerSaveBlocker
35.处理 | process
36.协议 | protocol
37.远程 | remote
38.sandbox
39.屏幕 | screen
40.会话 | session
41.shell
42.系统表现 | systemPreferences
43.触摸板 | TouchBar
44.触摸板按钮 | TouchBarButton
45.触摸板颜色选择器 | TouchBarColorPicker
46.触摸板组 | TouchBarGroup
47.触摸板标签 | TouchBarLabel
48.触摸板弹出框 | TouchBarPopover
49.触摸板清理 | TouchBarScrubber
50.触摸板分段控制 | TouchBarSegmentedControl
51.触摸板滑块 | TouchBarSlider
52.触摸板间隔 | TouchBarSpacer
53.Tray
54.网页内容 | webContents
55.网页框架 | webFrame
56.网页要求 | WebRequest
57.窗口开启 | window.open