可扩展电子应用程序的体系结构？

Question

这是一个有点开放性的问题，但是，制作一个好的可扩展电子应用程序的好方法是什么？VSCode、Atom和许多其他软件都支持扩展，但它们的代码库太大，我无法理解到底发生了什么。我对Jupyterlab感到非常惊讶，据他们说，它包含一个小小的核心，而其他一切都只是它上面的扩展。所以我想知道如何构建这些应用程序。

我的具体问题是：

• 是否有创建可扩展架构的最佳实践
• 电子部分是如何“识别”延伸的？怎么装的？什么时候加载
• 有没有一个简单的例子来说明如何做到这一点？从某种意义上讲，提供这两个例子可以回答整个问题：
  • 只在页面的特定空间添加按钮的扩展（因此，如何从扩展操作dom）
  • 如何在菜单栏中添加另一个选项（因此，如何从扩展与electron api交互。）

Answer 1

Electron是BYOEF（自带您自己的扩展框架），这意味着Electron中没有内置的扩展支持（是的，这个术语是我自己编的）。VS代码和Atom在Electron之上实现了自己的扩展层。

为了支持扩展，需要实现两个核心方面：

1. 一个API，它定义了扩展允许执行的所有操作，以及扩展可以钩住的所有事件

因为您提到了VS代码，让我们仔细看看它是如何实现扩展的（这可能被认为是可扩展架构的事实上的最佳实践）。

你提到了尝试查看源代码。正如你提到的，VS Code的代码库非常庞大，但是与扩展相关的最重要的代码可以在src/vs/workdesk/service/扩展/电子浏览器文件夹中找到。

VS代码将扩展作为npm模块分发。这允许每个扩展都依赖于其他npm模块，并允许VS代码轻松地更新扩展（每次打开扩展时都会这样做）。

当您选择安装扩展时，它将从VS Code的npm存储库下载。安装扩展的依赖项（当安装npm包时，通常会自动安装）。扩展导出一个激活函数，该函数在扩展完全安装后由VS Code调用。

它还导出一个停用函数，以便可以干净地删除它。

VS代码公开了用于扩展的API。他们可以订阅事件以侦听事件、调用公开的API函数、注册新的提供程序或注册新命令以添加新功能。

你要求的例子真的取决于你想做什么和你想怎么做。

要添加按钮，您的主页必须查找已注册的按钮并将其包含在页面上。在VS代码的工作方式中，每个扩展都会在activate（）函数中注册它们的按钮，如果它们愿意的话。

类似地，要在菜单栏中添加选项，您的Electron应用程序的菜单栏必须查找任何已注册的菜单扩展并用它们填充菜单栏。同样，扩展从不与Electron API交互，只与应用程序的API交互。您需要显式地定义一个API，并使扩展可以访问它（或者只是使整个Electron API可以访问，但这将导致一团混乱）。