DevTools扩展 | DevTools Extension

DevTools Extension

Electron支持Chrome DevTools Extension，该扩展可用于扩展devtools调试流行Web框架的能力。

如何加载DevTools扩展

本文档概述了手动加载扩展的过程。您也可以尝试一下第三方工具electron-devtools-installer，它可以直接从Chrome WebStore下载扩展程序。

要在Electron中加载扩展，您需要在Chrome浏览器中下载它，找到它的文件系统路径，然后通过调用BrowserWindow.addDevToolsExtension(extension)API 加载它。

以React Developer Tools为例：

• 在Chrome浏览器中安装它。

- on macOS it is `~/Library/Application Support/Google/Chrome/Default/Extensions`.

• 将扩展的位置传递给BrowserWindow.addDevToolsExtensionAPI，对于React Developer Tools来说，它就像这样：~/Library/Application Support/Google/Chrome/Default/Extensions/fmkadmapgofadopljbjfkapdkoienihi/0.15.0_0

注：该BrowserWindow.addDevToolsExtension发射应用模块的准备事件之前API不能叫。

扩展名由返回BrowserWindow.addDevToolsExtension，您可以将扩展的名称传递给BrowserWindow.removeDevToolsExtensionAPI以将其卸载。

支持的DevTools扩展

Electron仅支持一组有限的chrome.*API，因此一些使用不支持chrome.*的Chrome扩展功能的扩展可能无法使用。以下Devtools扩展程序经过测试并保证可以在Electron中工作：

• Ember Inspector

如果DevTools Extension无法正常工作，我应该怎么做？

首先请确保扩展程序仍在维护中，一些扩展程序甚至无法用于最新版本的Chrome浏览器，我们无法为它们做任何事情。

然后在Electron的问题列表中提交错误，并描述扩展的哪一部分没有按预期工作。