Skip to main content

Electron 1.0 即将推出的 API 变更

· 8 min read
zcbenz

自 Electron 诞生之初（当时它被称为 Atom-Shell）以来，我们一直在尝试为 Chromium 的内容模块和原生 GUI 组件提供优秀的跨平台 JavaScript API。这些 API 最初是有机地形成的，随着时间的推移，我们对其进行了多次修改，以改进初始设计。

¥Since the beginning of Electron, starting way back when it used to be called Atom-Shell, we have been experimenting with providing a nice cross-platform JavaScript API for Chromium's content module and native GUI components. The APIs started very organically, and over time we have made several changes to improve the initial designs.

随着 Electron 即将发布 1.0 版本，我们希望借此机会进行改进，解决最后几个繁琐的 API 细节问题。以下描述的更改包含在 0.35.x 版本中，旧 API 会报告弃用警告，以便你及时了解未来 1.0 版本的更新信息。Electron 1.0 还要几个月才会发布，因此在这些更改造成重大影响之前，你还有一段时间。

¥Now with Electron gearing up for a 1.0 release, we'd like to take the opportunity for change by addressing the last niggling API details. The changes described below are included in 0.35.x, with the old APIs reporting deprecation warnings so you can get up to date for the future 1.0 release. An Electron 1.0 won't be out for a few months so you have some time before these changes become breaking.

弃用警告​

¥Deprecation warnings

默认情况下，如果你使用已弃用的 API，则会显示警告。要关闭它们，你可以将 process.noDeprecation 设置为 true。要追踪已弃用 API 的使用来源，你可以将 process.throwDeprecation 设置为 true，以抛出异常而不是打印警告；或者，你可以将 process.traceDeprecation 设置为 true，以打印弃用 API 的痕迹。

¥By default, warnings will show if you are using deprecated APIs. To turn them off you can set process.noDeprecation to true. To track the sources of deprecated API usages, you can set process.throwDeprecation to true to throw exceptions instead of printing warnings, or set process.traceDeprecation to true to print the traces of the deprecations.

使用内置模块的新方法​

¥New way of using built-in modules

内置模块现在被分组为一个模块，而不是拆分成独立的模块，因此你可以使用它们 不与其他模块冲突：

¥Built-in modules are now grouped into one module, instead of being separated into independent modules, so you can use them without conflicts with other modules:

var app = require('electron').app;
var BrowserWindow = require('electron').BrowserWindow;

为了向后兼容，旧方法 require('app') 仍然受支持，但你也可以将其关闭：

¥The old way of require('app') is still supported for backward compatibility, but you can also turn if off:

require('electron').hideInternalModules();
require('app'); // throws error.

更轻松地使用 remote 模块的方法​

¥An easier way to use the remote module

由于使用内置模块的方式发生了变化，我们简化了在渲染进程中使用主进程侧模块的流程。现在你可以直接访问 remote 的属性来使用它们：

¥Because of the way using built-in modules has changed, we have made it easier to use main-process-side modules in renderer process. You can now just access remote's attributes to use them:

// New way.
var app = require('electron').remote.app;
var BrowserWindow = require('electron').remote.BrowserWindow;

不使用冗长的请求链：

¥Instead of using a long require chain:

// Old way.
var app = require('electron').remote.require('app');
var BrowserWindow = require('electron').remote.require('BrowserWindow');

拆分 ipc 模块​

¥Splitting the ipc module

ipc 模块同时存在于主进程和渲染进程中，并且两者的 API 不同，这会让新用户感到困惑。为了避免混淆，我们已将主进程中的模块重命名为 ipcMain，并将渲染进程中的模块重命名为 ipcRenderer：

¥The ipc module existed on both the main process and renderer process and the API was different on each side, which is quite confusing for new users. We have renamed the module to ipcMain in the main process, and ipcRenderer in the renderer process to avoid confusion:

// In main process.
var ipcMain = require('electron').ipcMain;
// In renderer process.
var ipcRenderer = require('electron').ipcRenderer;

对于 ipcRenderer 模块，在接收消息时添加了一个额外的 event 对象，以匹配 ipcMain 模块中消息的处理方式：

¥And for the ipcRenderer module, an extra event object has been added when receiving messages, to match how messages are handled in ipcMain modules:

ipcRenderer.on('message', function (event) {
  console.log(event);
});

标准化 BrowserWindow 选项​

¥Standardizing BrowserWindow options

BrowserWindow 选项的样式基于其他 API 的选项而有所不同，并且由于名称中包含 -，在 JavaScript 中使用起来有点困难。它们现在已标准化为传统的 JavaScript 名称：

¥The BrowserWindow options had different styles based on the options of other APIs, and were a bit hard to use in JavaScript because of the - in the names. They are now standardized to the traditional JavaScript names:

new BrowserWindow({ minWidth: 800, minHeight: 600 });

遵循 DOM 的 API 命名约定​

¥Following DOM's conventions for API names

Electron 中的 API 名称过去通常都采用驼峰命名法，例如 Url 到 URL，但 DOM 有自己的约定，它们更喜欢 URL 到 Url，同时使用 Id 而不是 ID。我们已重命名以下 API 以匹配 DOM 的样式：

¥The API names in Electron used to prefer camelCase for all API names, like Url to URL, but the DOM has its own conventions, and they prefer URL to Url, while using Id instead of ID. We have done the following API renames to match the DOM's styles:

  • Url 已重命名为 URL

    ¥Url is renamed to URL

  • Csp 已重命名为 CSP

    ¥Csp is renamed to CSP

由于这些变更，当你的应用使用 Electron v0.35.0 时，你会注意到许多弃用功能。修复这些问题的一个简单方法是将所有 Url 实例替换为 URL。

¥You will notice lots of deprecations when using Electron v0.35.0 for your app because of these changes. An easy way to fix them is to replace all instances of Url with URL.

Tray 事件名称变更​

¥Changes to Tray's event names

Tray 事件名称的风格与其他模块略有不同，因此已重命名以使其与其他模块匹配。

¥The style of Tray event names was a bit different from other modules so a rename has been done to make it match the others.

  • clicked 已重命名为 click

    ¥clicked is renamed to click

  • double-clicked 已重命名为 double-click

    ¥double-clicked is renamed to double-click

  • right-clicked 已重命名为 right-click

    ¥right-clicked is renamed to right-click