非常教程

Electron参考手册

指南 | Guides

在节点检查器中调试主进程 | Debugging the Main Process in node-inspector

node-inspector提供了一个熟悉的DevTools GUI,可以在Chrome中用于调试Electron的主进程,但是,因为node-inspector依赖于某些本地Node模块,必须重新构建它们才能定位要调试的Electron版本。你可以node-inspector自己重建依赖关系,或者让它electron-inspector为你做,这两种方法都包含在这个文档中。

注意:在撰写本文时,node-inspector无法修改(0.12.8)的最新版本,无法修补其某个依赖关系,因此无法重新构建目标以将Electron 1.3.0或更高版本作为目标。如果你使用electron-inspector它,你会照顾到这一点。

使用electron-inspector的调试

1.安装node-gyp必需的工具

2.安装electron-rebuild,如果你还没有这样做。

npm install electron-rebuild --save-dev

3.安装electron-inspector

npm install electron-inspector --save-dev

4.启动Electron

--debug开关启动Electron:

electron --debug=5858 your/app

或者,暂停第一行JavaScript的执行:

electron --debug-brk=5858 your/app

5.启动electron-inspector

在MacOS/Linux上:

node_modules/.bin/electron-inspector

在Windows上:

node_modules\\.bin\\electron-inspector

electron-inspector将需要node-inspector在第一次运行时重建依赖关系,并且每次更改Electron版本时都需要重新生成依赖关系。重建过程可能需要互联网连接才能下载节点标题和库,可能需要几分钟的时间。

6.加载调试器UI

在Chrome浏览器中打开http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858。如果开始--debug-brk强制更新UI,您可能需要点击暂停。

使用node-inspector的调试

1.安装node-gyp必需的工具

2.安装node-inspector

$ npm install node-inspector

3.安装node-pre-gyp

$ npm install node-pre-gyp

4.重新编译node-inspector v8Electron模块

注意:将目标参数更新为您的Electron版本号

$ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-debug/ --dist-url=https://atom.io/download/atom-shell reinstall
$ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-profiler/ --dist-url=https://atom.io/download/atom-shell reinstall

另请参见如何安装本机模块。

5.启用Electron的调试模式

您可以使用如下调试标志启动Electron:

$ electron --debug=5858 your/app

或者,在第一行中暂停您的脚本:

$ electron --debug-brk=5858 your/app

6. node-inspector使用Electron 启动服务器

$ ELECTRON_RUN_AS_NODE=true path/to/electron.exe node_modules/node-inspector/bin/inspector.js

7.加载调试器UI

在Chrome浏览器中打开http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858。如果开始--debug-brk查看输入行,您可能需要点击暂停。

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