JSRUN 用代码说话

DevTools扩展

编辑教程

DevTools扩展

为了使调试更容易,Electron 原生支持 Chrome DevTools Extension。

对于大多数DevTools的扩展,你可以直接下载源码,然后通过 BrowserWindow.addDevToolsExtension API 加载它们。Electron会记住已经加载了哪些扩展,所以你不需要每次创建一个新window时都调用 BrowserWindow.addDevToolsExtension API。

例如,要用React DevTools Extension,你得先下载他的源码:

$ cd /some-directory
$ git clone --recursive https://github.com/facebook/react-devtools.git

然后你就可以在任意页面的 DevTools 里加载 React DevTools 了,通过控制台输入如下命令加载扩展:

const BrowserWindow = require('electron').remote.BrowserWindow;
BrowserWindow.addDevToolsExtension('/some-directory/react-devtools/shells/chrome');

要卸载扩展,可以调用 BrowserWindow.removeDevToolsExtension API (扩展名作为参数传入),该扩展在下次打开DevTools时就不会加载了:

BrowserWindow.removeDevToolsExtension('React Developer Tools');

DevTools 扩展的格式

理论上,Electron 可以加载所有为 chrome 浏览器编写的 DevTools 扩展,但它们必须存放在文件夹里。那些以 crx 形式发布的扩展是不能被加载的,除非你把它们解压到一个文件夹里。

后台运行(background pages)

Electron 目前并不支持 chrome 扩展里的后台运行(background pages)功能,所以那些依赖此特性的 DevTools 扩展在 Electron 里可能无法正常工作。

chrome.* APIs

有些 chrome 扩展使用了 chrome.*APIs,而且这些扩展在 Electron 中需要额外实现一些代码才能使用,所以并不是所有的这类扩展都已经在 Electron 中实现完毕了。

考虑到并非所有的 chrome.APIs 都实现完毕,如果 DevTools 正在使用除了 chrome.devtools. 之外的其它 APIs,这个扩展很可能无法正常工作。你可以通过报告这个扩展的异常信息,这样做方便我们对该扩展的支持。

JSRUN闪电教程系统是国内最先开创的教程维护系统, 所有工程师都可以参与共同维护的闪电教程,让知识的积累变得统一完整、自成体系。 大家可以一起参与进共编,让零散的知识点帮助更多的人。
X
支付宝
9.99
无法付款,请点击这里
金额: 0
备注:
转账时请填写正确的金额和备注信息,到账由人工处理,可能需要较长时间
如有疑问请联系QQ:565830900
正在生成二维码, 此过程可能需要15秒钟