在过去的两年里，Electron 帮助开发者使用 HTML、CSS 和 JavaScript 构建跨平台的桌面应用。现在，我们很高兴与大家分享我们的框架及其社区取得的一个重要里程碑。Electron 1.0 现已在 electronjs.org 发布。

🌐 For the last two years, Electron has helped developers build cross platform desktop apps using HTML, CSS, and JavaScript. Now we're excited to share a major milestone for our framework and for the community that created it. The release of Electron 1.0 is now available from electronjs.org.

Electron 1.0 代表了 API 稳定性和成熟度的一个重要里程碑。这个版本允许你在 Windows、Mac 和 Linux 上构建真正本地体验的应用。借助新的文档、新工具以及引导你了解 Electron API 的新应用，构建 Electron 应用比以往任何时候都更加容易。

🌐 Electron 1.0 represents a major milestone in API stability and maturity. This release allows you to build apps that act and feel truly native on Windows, Mac, and Linux. Building Electron apps is easier than ever with new docs, new tools, and a new app to walk you through the Electron APIs.

如果你准备好创建你的第一个 Electron 应用，这里有一个 快速入门指南 可以帮助你入门。

🌐 If you're ready to build your very first Electron app, here's a quick start guide to help you get started.

我们期待看到你接下来使用 Electron 构建的作品。

🌐 We are excited to see what you build next with Electron.

Electron 路径​

🌐 Electron's Path

我们在两年多前推出Atom时发布了Electron。Electron，当时被称为Atom Shell，是我们构建Atom的基础框架。那时候，Atom是推动Electron提供各项功能和特性的动力，因为我们在努力发布最初的Atom版本。

🌐 We released Electron when we launched Atom a little over two years ago. Electron, then known as Atom Shell, was the framework we'd built Atom on top of. In those days, Atom was the driving force behind the features and functionalities that Electron provided as we pushed to get the initial Atom release out.

现在，Electron 的使用者社区正在不断壮大，包括开发者和公司，他们正在构建从 电子邮件、聊天、Git 应用 到 SQL 分析工具、种子客户端、机器人 的各种项目。

🌐 Now driving Electron is a growing community of developers and companies building everything from email, chat, and Git apps to SQL analytics tools, torrent clients, and robots.

在过去的两年里，我们看到公司和开源项目都选择 Electron 作为其应用的基础。仅在去年，Electron 的下载量就超过了 120 万次。这里列出了一些出色的 Electron 应用，如果其中还没有你自己的应用，也可以添加进去。

🌐 In these last two years we've seen both companies and open source projects choose Electron as the foundation for their apps. Just in the past year, Electron has been downloaded over 1.2 million times. Take a tour of some of the amazing Electron apps and add your own if it isn't already there.

Electron API 演示​

🌐 Electron API Demos

随着 1.0 版本的发布，我们也推出了一款新应用，帮助你探索 Electron API，并了解如何让你的 Electron 应用更本地化。Electron API 演示 应用包含代码示例，帮助你启动应用，并提供有效使用 Electron API 的技巧。

🌐 Along with the 1.0 release, we're releasing a new app to help you explore the Electron APIs and learn more about how to make your Electron app feel native. The Electron API Demos app contains code snippets to help you get your app started and tips on effectively using the Electron APIs.

Devtron​

我们还新增了一个扩展，以帮助你调试 Electron 应用。Devtron 是一个开源扩展，用于 Chrome 开发者工具，旨在帮助你检查、调试和排除 Electron 应用的问题。

🌐 We've also added a new extension to help you debug your Electron apps. Devtron is an open-source extension to the Chrome Developer Tools designed to help you inspect, debug, and troubleshoot your Electron app.

功能​

🌐 Features

• 需要图表，帮助你可视化应用在主进程和渲染进程中的内部和外部库依赖
• IPC 监视器，用于跟踪并显示应用中各进程之间发送和接收的消息
• 事件检查器，显示在你的应用中注册的事件和监听器，这些事件和监听器存在于核心 Electron API 上，例如窗口、应用和进程
• 应用检测器，检查你的应用是否存在常见错误和缺失的功能

Spectron​

最后，我们将发布 Spectron 的新版本，这是用于 Electron 应用的集成测试框架。

🌐 Finally, we're releasing a new version of Spectron, the integration testing framework for Electron apps.

Spectron 3.0 对整个 Electron API 提供全面支持，使你能够更快速地编写测试，以验证应用在各种场景和环境中的行为。Spectron 基于 Chrome驱动 和 WebDriverIO，因此它还提供了完整的页面导航、用户输入和 JavaScript 执行的 API。

🌐 Spectron 3.0 has comprehensive support for the entire Electron API allowing you to more quickly write tests that verify your application's behavior in various scenarios and environments. Spectron is based on ChromeDriver and WebDriverIO so it also has full APIs for page navigation, user input, and JavaScript execution.

社区​

🌐 Community

Electron 1.0 是数百名开发者共同努力的结果。在核心框架之外，还发布了数百个库和工具，以使构建、打包和部署 Electron 应用更加容易。

🌐 Electron 1.0 is the result of a community effort by hundreds of developers. Outside of the core framework, there have been hundreds of libraries and tools released to make building, packaging, and deploying Electron apps easier.

现在有一个新的 社区 页面，列出了许多正在开发的很棒的 Electron 工具、应用、库和框架。你也可以查看 Electron 和 Electron 用户层 组织，了解一些这些出色的项目。

🌐 There is now a new community page that lists many of the awesome Electron tools, apps, libraries, and frameworks being developed. You can also check out the Electron and Electron Userland organizations to see some of these fantastic projects.

刚接触 Electron？观看 Electron 1.0 入门视频：

🌐 New to Electron? Watch the Electron 1.0 intro video:

Electron 0.37 最近已发布，并进行了重大升级，从 Chrome 47 更新到 Chrome 49，同时还增加了几个新的核心 API。此次最新发布带来了Chrome 48 和 Chrome 49 中的所有新功能。这包括 CSS 自定义属性、增强的 ES6 支持、KeyboardEvent 改进、Promise 改进，以及在你的 Electron 应用中可用的许多其他新功能。

🌐 Electron 0.37 was recently released and included a major upgrade from Chrome 47 to Chrome 49 and also several new core APIs. This latest release brings in all the new features shipped in Chrome 48 and Chrome 49. This includes CSS custom properties, increased ES6 support, KeyboardEvent improvements, Promise improvements, and many other new features now available in your Electron app.

新功能​

🌐 What's New

CSS 自定义属性​

🌐 CSS Custom Properties

如果你使用过像 Sass 和 Less 这样的预处理语言，你可能已经熟悉了 变量，它们允许你为颜色方案和布局等内容定义可重用的值。变量有助于保持样式表的 DRY（不重复自己）性，并使其更易于维护。

🌐 If you've used preprocessed languages like Sass and Less, you're probably familiar with variables, which allow you to define reusable values for things like color schemes and layouts. Variables help keep your stylesheets DRY and more maintainable.

CSS 自定义属性类似于预处理变量，因为它们是可重复使用的，但它们还有一种独特的特性，使它们更强大、更灵活：可以使用 JavaScript 操作。这个微妙但强大的功能允许对视觉界面进行动态修改，同时仍然享受 CSS 的硬件加速 的好处，并减少前端代码与样式表之间的代码重复。

🌐 CSS custom properties are similar to preprocessed variables in that they are reusable, but they also have a unique quality that makes them even more powerful and flexible: they can be manipulated with JavaScript. This subtle but powerful feature allows for dynamic changes to visual interfaces while still benefitting from CSS's hardware acceleration, and reduced code duplication between your frontend code and stylesheets.

有关 CSS 自定义属性的更多信息，请参阅 MDN 文章 和 Google Chrome 演示。

🌐 For more info on CSS custom properties, see the MDN article and the Google Chrome demo.

CSS 变量的实际应用​

🌐 CSS Variables In Action

让我们来看一个可以在你的应用中实时调整的简单变量示例。

🌐 Let's walk through a simple variable example that can be tweaked live in your app.

:root {
  --awesome-color: #a5ecfa;
}

body {
  background-color: var(--awesome-color);
}

变量值可以直接在 JavaScript 中检索和更改：

🌐 The variable value can be retrieved and changed directly in JavaScript:

// Get the variable value ' #A5ECFA'
let color = window
  .getComputedStyle(document.body)
  .getPropertyValue('--awesome-color');

// Set the variable value to 'orange'
document.body.style.setProperty('--awesome-color', 'orange');

变量值也可以在开发工具的 样式 部分进行编辑，以便快速反馈和调整：

🌐 The variable values can be also edited from the Styles section of the development tools for quick feedback and tweaks:

KeyboardEvent.code 属性​

🌐 KeyboardEvent.code Property

Chrome 48 在 KeyboardEvent 事件上新增了 code 属性，该属性将表示实际按下的物理按键，而不受操作系统键盘布局的影响。

🌐 Chrome 48 added the new code property available on KeyboardEvent events that will be the physical key pressed independent of the operating system keyboard layout.

这应该使你在 Electron 应用中实现自定义键盘快捷键在不同机器和配置之间更加准确和一致。

🌐 This should make implementing custom keyboard shortcuts in your Electron app more accurate and consistent across machines and configurations.

window.addEventListener('keydown', function (event) {
  console.log(`${event.code} was pressed.`);
});

查看这个示例以了解其实际操作。

🌐 Check out this example to see it in action.

Promise 拒绝事件​

🌐 Promise Rejection Events

Chrome 49 添加了两个新的 window 事件，允许你在被拒绝的 Promise 未处理时收到通知。

🌐 Chrome 49 added two new window events that allow you to be notified when an rejected Promise goes unhandled.

window.addEventListener('unhandledrejection', function (event) {
  console.log('A rejected promise was unhandled', event.promise, event.reason);
});

window.addEventListener('rejectionhandled', function (event) {
  console.log('A rejected promise was handled', event.promise, event.reason);
});

查看这个示例以了解其实际操作。

🌐 Check out this example to see it in action.

V8 中的 ES2015 更新​

🌐 ES2015 Updates in V8

Electron 中使用的 V8 版本现在支持 91% 的 ES2015。这里有一些有趣的新功能，你可以开箱即用——无需标志或预编译器：

🌐 The version of V8 now in Electron incorporates 91% of ES2015. Here are a few interesting additions you can use out of the box—without flags or pre-compilers:

默认参数​

🌐 Default parameters

function multiply(x, y = 1) {
  return x * y;
}

multiply(5); // 5

解构赋值​

🌐 Destructuring assignment

Chrome 49 添加了解构赋值，使变量和函数参数的赋值更容易。

🌐 Chrome 49 added destructuring assignment to make assigning variables and function parameters much easier.

这使得 Electron 的需求分配更加简洁紧凑：

🌐 This makes Electron requires cleaner and more compact to assign now:

浏览器进程要求​

🌐 Browser Process Requires

const { app, BrowserWindow, Menu } = require('electron');

渲染器进程需求​

🌐 Renderer Process Requires

const { dialog, Tray } = require('electron').remote;

其他示例​

🌐 Other Examples

// Destructuring an array and skipping the second element
const [first, , last] = findAll();

// Destructuring function parameters
function whois({ displayName: displayName, fullName: { firstName: name } }) {
  console.log(`${displayName} is ${name}`);
}

let user = {
  displayName: 'jdoe',
  fullName: {
    firstName: 'John',
    lastName: 'Doe',
  },
};
whois(user); // "jdoe is John"

// Destructuring an object
let { name, avatar } = getUser();

新的 Electron API​

🌐 New Electron APIs

下面是一些新的 Electron API，你可以在 Electron 发布 的发行说明中查看每个新 API。

🌐 A few of the new Electron APIs are below, you can see each new API in the release notes for Electron releases.

BrowserWindow 上的 show 和 hide 事件​

🌐 show and hide events on BrowserWindow

这些事件在窗口显示或隐藏时发出。

🌐 These events are emitted when the window is either shown or hidden.

const { BrowserWindow } = require('electron');

let window = new BrowserWindow({ width: 500, height: 500 });
window.on('show', function () {
  console.log('Window was shown');
});
window.on('hide', function () {
  console.log('Window was hidden');
});

platform-theme-changed 于 app 针对 OS X​

🌐 platform-theme-changed on app for OS X

当系统的夜间模式主题切换时，会触发此事件。

🌐 This event is emitted when the system’s Dark Mode theme is toggled.

const { app } = require('electron');

app.on('platform-theme-changed', function () {
  console.log(`Platform theme changed. In dark mode? ${app.isDarkMode()}`);
});

app.isDarkMode() 用于 OS X​

🌐 app.isDarkMode() for OS X

如果系统处于夜间模式，该方法返回 true，否则返回 false。

🌐 This method returns true if the system is in Dark Mode, and false otherwise.

scroll-touch-begin 和 scroll-touch-end 事件到 OS X 的 BrowserWindow​

🌐 scroll-touch-begin and scroll-touch-end events to BrowserWindow for OS X

这些事件在滚轮事件阶段开始或结束时发出。

🌐 These events are emitted when the scroll wheel event phase has begun or has ended.

const { BrowserWindow } = require('electron');

let window = new BrowserWindow({ width: 500, height: 500 });
window.on('scroll-touch-begin', function () {
  console.log('Scroll touch started');
});
window.on('scroll-touch-end', function () {
  console.log('Scroll touch ended');
});

构建一个 Electron 应用意味着你只需要创建一个代码库并为一个浏览器进行设计，这非常方便。但由于 Electron 会随着 Node.js 和 Chromium 的发布而保持更新，你也可以利用它们提供的优秀功能。在某些情况下，这还能消除你在之前的网页应用中可能需要包含的依赖。

🌐 Building an Electron application means you only need to create one codebase and design for one browser, which is pretty handy. But because Electron stays up to date with Node.js and Chromium as they release, you also get to make use of the great features they ship with. In some cases this eliminates dependencies you might have previously needed to include in a web app.

有很多功能，我们会在这里举一些例子，但如果你想了解所有功能，可以关注 Google Chromium 博客 和 Node.js 更新日志。你可以在 electronjs.org/#electron-versions 查看 Electron 使用的 Node.js、Chromium 和 V8 的版本。

🌐 There are many features and we'll cover some here as examples, but if you're interested in learning about all features you can keep an eye on the Google Chromium blog and Node.js changelogs. You can see what versions of Node.js, Chromium and V8 Electron is using at electronjs.org/#electron-versions.

通过 V8 支持 ES6​

🌐 ES6 Support through V8

Electron 将 Chromium 的渲染库与 Node.js 结合在一起。二者共享相同的 JavaScript 引擎 V8。许多 ECMAScript 2015 (ES6) 特性已经内置在 V8 中，这意味着你可以在 Electron 应用中直接使用它们，而无需任何编译器。

🌐 Electron combines Chromium's rendering library with Node.js. The two share the same JavaScript engine, V8. Many ECMAScript 2015 (ES6) features are already built into V8 which means you can use them in your Electron application without any compilers.

下面是一些例子，但你还可以使用类（严格模式下）、块级作用域、Promise、类型化数组等功能。有关 V8 中 ES6 特性的更多信息，请查看 此列表。

🌐 Below are a few examples but you can also get classes (in strict mode), block scoping, promises, typed arrays and more. Check out this list for more information on ES6 features in V8.

箭头函数

findTime () => {
  console.log(new Date())
}

字符串插值

var octocat = 'Mona Lisa';
console.log(`The octocat's name is ${octocat}`);

新目标

Octocat() => {
  if (!new.target) throw "Not new";
  console.log("New Octocat");
}

// Throws
Octocat();
// Logs
new Octocat();

数组包含

// Returns true
[1, 2].includes(2);

剩余参数

// Represent indefinite number of arguments as an array
(o, c, ...args) => {
  console.log(args.length);
};

Chromium 功能​

🌐 Chromium Features

感谢 Google 和贡献者为 Chromium 付出的辛勤劳动，在你构建 Electron 应用时，你还可以使用以下一些很酷的功能（但不限于）：

🌐 Thanks to all the hard work Google and contributors put into Chromium, when you build Electron apps you can also use cool things like (but not limited to):

• MouseEvent.getModifierState()
• CSS.escape()
• Fetch API 流式处理

请关注 Google Chromium 博客 了解新版本发布时的功能，另外，你也可以在 这里 查看 Electron 使用的 Chromium 版本。

🌐 Follow along with the Google Chromium blog to learn about features as new versions ship and again, you can check the version of Chromium that Electron uses here.

你对什么感到兴奋？​

🌐 What are you excited about?

通过推特@ElectronJS告诉我们你最喜欢在 V8 或 Chromium 中实现的功能。

🌐 Tweet to us @ElectronJS with your favorite features built into V8 or Chromium.

自从 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 来打印弃用的跟踪信息。

🌐 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 名称过去偏向于对所有 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
• Csp 已重命名为 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
• double-clicked 已重命名为 double-click
• right-clicked 已重命名为 right-click

最近，Electron 增加了两个令人兴奋的功能：兼容 Mac 应用商店的版本和内置的 Windows 自动更新器。

🌐 Recently Electron added two exciting features: a Mac App Store compatible build and a built-in Windows auto updater.

Mac App Store 支持​

🌐 Mac App Store Support

截至 v0.34.0，每个 Electron 版本都包含一个与 Mac App Store 兼容的构建版本。以前，使用 Electron 构建的应用无法符合苹果 Mac App Store 的要求。这些要求大多与使用私有 API 有关。为了将 Electron 沙箱化以符合这些要求，需要移除两个模块：

🌐 As of v0.34.0 each Electron release includes a build compatible with the Mac App Store. Previously an application built on Electron would not comply with Apple's requirements for the Mac App Store. Most of these requirements are related to the use of private APIs. In order to sandbox Electron in such a way that it complies with the requirements two modules needed to be removed:

• crash-reporter
• auto-updater

此外，在检测 DNS 更改、视频捕获和辅助功能方面，一些行为也发生了变化。你可以在文档中阅读有关这些更改以及向 Mac App Store 提交你的应用的更多信息。可以在Electron 发布页面找到这些分发版本，前缀为 mas-。

🌐 Additionally some behaviors have changed with respect to detecting DNS changes, video capture and accessibility features. You can read more about the changes and submitting your app to the Mac App store in the documentation. The distributions can be found on the Electron releases page, prefixed with mas-.

相关的拉取请求: electron/electron#3108, electron/electron#2920

🌐 Related Pull Requests: electron/electron#3108, electron/electron#2920

Windows 自动更新程序​

🌐 Windows Auto Updater

在 Electron v0.34.1 中，auto-updater 模块得到了改进，以便与 Squirrel.Windows 一起使用。这意味着 Electron 提供了在 OS X 和 Windows 上轻松自动更新应用的方法。你可以在文档中阅读更多关于在 Windows 上为应用配置自动更新 的信息。

🌐 In Electron v0.34.1 the auto-updater module was improved in order to work with Squirrel.Windows. This means that Electron ships with easy ways for auto updating your app on both OS X and Windows. You can read more on setting up your app for auto updating on Windows in the documentation.

相关拉取请求：electron/electron#1984

🌐 Related Pull Request: electron/electron#1984

最近 Electron 上有一些有趣的更新和讨论，以下是总结。

🌐 There have been some interesting updates and talks given on Electron recently, here's a roundup.

来源​

🌐 Source

到 v0.32.0 为止，Electron 已经更新至与 Chrome 45 同步。其他更新包括...

🌐 Electron is now up to date with Chrome 45 as of v0.32.0. Other updates include...

更完善的文档​

🌐 Better Documentation

我们已经重新整理并标准化了文档，使其看起来更美观、阅读起来更顺畅。文档还有社区贡献的翻译版本，例如日语和韩语。

🌐 We have restructured and standardized the documentation to look better and read better. There are also community-contributed translations of the documentation, like Japanese and Korean.

相关的拉取请求： electron/electron#2028、 electron/electron#2533、 electron/electron#2557、 electron/electron#2709、 electron/electron#2725、 electron/electron#2698、 electron/electron#2649。

🌐 Related pull requests: electron/electron#2028, electron/electron#2533, electron/electron#2557, electron/electron#2709, electron/electron#2725, electron/electron#2698, electron/electron#2649.

Node.js 4.1.0​

自从 v0.33.0 Electron 搭载了 Node.js 4.1.0。

🌐 Since v0.33.0 Electron ships with Node.js 4.1.0.

相关的拉取请求： electron/electron#2817。

🌐 Related pull request: electron/electron#2817.

node-pre-gyp​

依赖 node-pre-gyp 的模块现在可以在从源代码构建时针对 Electron 进行编译。

🌐 Modules relying on node-pre-gyp can now be compiled against Electron when building from source.

相关的拉取请求： mapbox/node-pre-gyp#175。

🌐 Related pull request: mapbox/node-pre-gyp#175.

ARM 支持​

🌐 ARM Support

Electron 现在提供针对 ARMv7 的 Linux 构建版本。它可以运行在 Chromebook 和 Raspberry Pi 2 等流行平台上。

🌐 Electron now provides builds for Linux on ARMv7. It runs on popular platforms like Chromebook and Raspberry Pi 2.

相关问题： atom/libchromiumcontent#138， electron/electron#2094， electron/electron#366。

🌐 Related issues: atom/libchromiumcontent#138, electron/electron#2094, electron/electron#366.

Yosemite 风格的无框窗口​

🌐 Yosemite-style Frameless Window

@jaanus 的一个补丁已被合并，该补丁与其他内置的 OS X 应用一样，允许在 OS X Yosemite 及更高版本上创建带有系统交通灯的无框窗口。

🌐 A patch by @jaanus has been merged that, like the other built-in OS X apps, allows creating frameless windows with system traffic lights integrated on OS X Yosemite and later.

相关的拉取请求： electron/electron#2776。

🌐 Related pull request: electron/electron#2776.

Google 编程夏令营打印支持​

🌐 Google Summer of Code Printing Support

在 Google 夏季编码活动之后，我们合并了 @hokein 的补丁，以改进打印支持，并增加将页面打印成 PDF 文件的功能。

🌐 After the Google Summer of Code we have merged patches by @hokein to improve printing support, and add the ability to print the page into PDF files.

相关问题： electron/electron#2677， electron/electron#1935， electron/electron#1532， electron/electron#805， electron/electron#1669， electron/electron#1835。

🌐 Related issues: electron/electron#2677, electron/electron#1935, electron/electron#1532, electron/electron#805, electron/electron#1669, electron/electron#1835.

Atom​

Atom 现在已升级到运行 Chrome 44 的 Electron v0.30.6。升级到 v0.33.0 正在 atom/atom#8779 上进行。

🌐 Atom has now upgraded to Electron v0.30.6 running Chrome 44. An upgrade to v0.33.0 is in progress on atom/atom#8779.

讨论​

🌐 Talks

GitHub 用户 Amy Palamountain 在 Nordic.js 的一次演讲中对 Electron 做了精彩的介绍。她还创建了 electron-accelerator 库。

🌐 GitHubber Amy Palamountain gave a great introduction to Electron in a talk at Nordic.js. She also created the electron-accelerator library.

使用 Electron 构建原生应用，作者：Amy Palomountain​

🌐 Building native applications with Electron by Amy Palomountain

Ben Ogle，同样在 Atom 团队，曾在 YAPC Asia 做过关于 Electron 的演讲：

使用 Web 技术构建桌面应用，作者：Ben Ogle​

🌐 Building Desktop Apps with Web Technologies by Ben Ogle

Atom 团队成员 Kevin Sawicki 和其他人最近在 Bay Area Electron 用户组 的聚会上就 Electron 进行了演讲。视频 已经发布，这里有几个：

🌐 Atom team member Kevin Sawicki and others gave talks on Electron at the Bay Are Electron User Group meetup recently. The videos have been posted, here are a couple:

Kevin Sawicki 撰写的 Electron 历史​

🌐 The History of Electron by Kevin Sawicki

Ben Gotow 撰写的《让 Web 应用感觉原生》​

🌐 Making a web app feel native by Ben Gotow

加入我们，9月29日在 GitHub 总部参加由 Atom 团队成员 @jlord 和 @kevinsawicki 主办的 Electron 聚会。现场将有讲座、零食和交流时间，大家可以一起互动，认识正在使用 Electron 做酷事情的人。我们还将留出一些时间给有兴趣的朋友做闪电演讲。希望在那里见到你！

🌐 Join us September 29th at GitHub's HQ for an Electron meetup hosted by Atom team members @jlord and @kevinsawicki. There will be talks, food to snack on, and time to hangout and meet others doing cool things with Electron. We'll also have a bit of time to do lightning talks for those interested. Hope to see you there!

谈话

• Jonathan Ross 和 Francois Laberge 来自 Jibo 将分享他们如何使用 Electron 为机器人制作动画。
• Jessica Lord 将讨论如何在 Electron 上构建教学工具 Git-it。
• Tom Moor 将讨论在 Electron 上使用 speak.io 构建视频和屏幕共享的利与弊。
• Ben Gotow 将预览 N1: Nylas 邮件客户端 并讲解在 Electron 上开发它。

细节​

🌐 Details

• 地点： GitHub 总部，美国加利福尼亚州旧金山布兰南街 275 号，邮编 94107
• **日期：**2015年9月29日，星期二
• 时间： 下午6点 - 9点
• 请回复出席： ti.to/github-events/electron-meetup

本周我们为 Electron 的文档在 electronjs.org 上找到了一个归宿。你可以访问 /docs/latest 获取最新的文档集合。我们也会保留旧版本的文档，因此你可以访问 /docs/vX.XX.X 查看与你使用的版本对应的文档。

🌐 This week we've given Electron's documentation a home on electronjs.org. You can visit /docs/latest for the latest set of docs. We'll keep versions of older docs, too, so you're able to visit /docs/vX.XX.X for the docs that correlate to the version you're using.

你可以访问 /docs 查看可用的版本，或访问 /docs/all 在同一页面上查看文档的最新版本（对 cmd + f 搜索很有用）。

🌐 You can visit /docs to see what versions are available or /docs/all to see the latest version of docs all on one page (nice for cmd + f searches).

如果你希望为文档内容做出贡献，可以在 Electron 仓库 中进行，我们的文档就是从那里获取的。我们会在每个次要版本发布时获取文档，并将其添加到使用 Jekyll 制作的 Electron 网站仓库 中。

🌐 If you'd like to contribute to the docs content, you can do so in the Electron repository, where the docs are fetched from. We fetch them for each minor release and add them to the Electron site repository, which is made with Jekyll.

如果你想了解更多关于我们如何将文档从一个仓库拉到另一个仓库的信息，请继续阅读下面的内容。否则，请享用这些文档！

🌐 If you're interested in learning more about how we pull the docs from one repository to another continue reading below. Otherwise, enjoy the docs!

技术细节​

🌐 The Technical Bits

我们会在 Electron 核心仓库中按原样保留文档。这意味着 electron/electron 将始终拥有最新版本的文档。当发布新的 Electron 版本时，我们会将它们复制到 Electron 网站仓库 electron/electronjs.org 上。

🌐 We're preserving the documentation within the Electron core repository as is. This means that electron/electron will always have the latest version of the docs. When new versions of Electron are released, we duplicate them over on the Electron website repository, electron/electronjs.org.

script/docs​

为了获取文档，我们运行一个带有命令行接口 script/docs vX.XX.X 的 脚本，可以选择使用或不使用 --latest 选项（取决于你导入的版本是否为最新版本）。我们的 获取文档的脚本 使用了一些有趣的 Node 模块：

🌐 To fetch the docs we run a script with a command line interface of script/docs vX.XX.X with or without the --latest option (depending on if the version you're importing is the latest version). Our script for fetching docs uses a few interesting Node modules:

• nugget 用于 获取发布压缩包 并将其保存到临时目录。
• gunzip-maybe 来 解压 tar 包。
• tar-fs 用于 从 tar 包中仅流式传输 /docs 目录 并 过滤和处理文件（借助 through2）以便它们能很好地与我们的 Jekyll 网站配合使用（详见下文）。

测试 帮助我们确认所有零部件都按预期到位。

Jekyll​

Electron 网站是一个 Jekyll 网站，我们在文档中使用 Collections 功能，结构如下：

🌐 The Electron website is a Jekyll site and we make use of the Collections feature for the docs with a structure like this:

electron.atom.io
└── _docs
    ├── latest
    ├── v0.27.0
    ├── v0.26.0
    ├── so on
    └── so forth

前言​

🌐 Front matter

为了让 Jekyll 渲染每个页面，它至少需要空的 front matter。我们打算在所有页面上使用 front matter，所以在我们浏览 /docs 目录时，会检查文件是否是 README.md 文件（如果是，它会接收到一种 front matter 配置），或者是否是任何其他扩展名为 Markdown 的文件（如果是，它会接收到稍微不同的 front matter）。

🌐 For Jekyll to render each page it needs at least empty front matter. We're going to make use of front matter on all of our pages so while we're streaming out the /docs directory we check to see if a file is the README.md file (in which case it receives one front matter configuration) or if it is any other file with a markdown extension (in which case it receives slightly different front matter).

每个页面都包含以下一组前置变量：

🌐 Each page receives this set of front matter variables:

---
version: v0.27.0
category: Tutorial
title: 'Quick Start'
source_url: 'https://github.com/electron/electron/blob/master/docs/tutorial/quick-start.md'
---

README.md 会额外获得 permalink，这样它的 URL 就有一个共同的根 index.html，而不是一个尴尬的 /readme/。

🌐 The README.md gets an additional permalink so that has a URL has a common root of index.html rather than an awkward /readme/.

permalink: /docs/v0.27.0/index.html

配置和重定向​

🌐 Config and Redirects

在站点的 _config.yml 文件中，每次在获取文档时使用 --latest 标志时，都会设置一个变量 latest_version。我们还会添加一个包含已添加到站点的所有版本的列表，以及我们希望用于整个文档集合的永久链接。

🌐 In the site's _config.yml file a variable latest_version is set every time the --latest flag is used when fetching docs. We also add a list of all the versions that have been added to the site as well as the permalink we'd like for the entire docs collection.

latest_version: v0.27.0
available_versions:
  - v0.27.0
collections:
  docs: { output: true, permalink: '/docs/:path/' }

我们网站根目录下的文件 latest.md 除了这段前置内容外是空的，这段前置内容允许用户通过访问这个网址 electron.atom.io/docs/latest 来查看最新版本文档的索引（也就是 README），而不必特别使用最新的版本号（当然你也可以这样做）。

🌐 The file latest.md in our site root is empty except for this front matter which allows users to see the index (aka README) of the latest version of docs by visiting this URL, electron.atom.io/docs/latest, rather than using the latest version number specifically (though you can do that, too).

---
permalink: /docs/latest/
redirect_to: /docs/{{ site.data.releases[0].version }}
---

布局​

🌐 Layouts

在 docs.html 布局模板中，我们使用条件语句来显示或隐藏页眉和面包屑中的信息。

🌐 In the docs.html layout template we use conditionals to either show or hide information in the header and breadcrumb.

{% raw %} {% if page.category != 'ignore' %}
<h6 class="docs-breadcrumb">
  {{ page.version }} / {{ page.category }} {% if page.title != 'README' %} / {{
  page.title }} {% endif %}
</h6>
{% endif %} {% endraw %}

要创建一个显示可用版本的页面，我们只需遍历位于站点根目录中文件 versions.md 中的配置列表即可。同时，我们还为该页面设置了一个固定链接：/docs/

🌐 To create a page showing the versions that are available we just loop through the list in our config on a file, versions.md, in the site's root. Also we give this page a permalink: /docs/

{% raw %} {% for version in site.available_versions %} - [{{ version
}}](/docs/{{ version }}) {% endfor %} {% endraw %}

希望你喜欢这些技术内容！如果你想了解更多关于使用 Jekyll 构建文档网站的信息，可以看看 GitHub 的文档团队是如何在 Jekyll 上发布 GitHub 的文档 的。

🌐 Hope you enjoyed these technical bits! If you're interested in more information on using Jekyll for documentation sites, checkout how GitHub's docs team publishes GitHub's docs on Jekyll.

Atom Shell 现在叫做 Electron。你可以在它的新主页 electronjs.org 了解更多关于 Electron 的信息以及人们用它构建的项目。

🌐 Atom Shell is now called Electron. You can learn more about Electron and what people are building with it at its new home electronjs.org.

Electron 是我们最初为 Atom 编辑器 构建的跨平台应用框架，用于处理 Chromium/Node.js 事件循环集成和本地 API。

🌐 Electron is the cross-platform application shell we originally built for the Atom editor to handle the Chromium/Node.js event loop integration and native APIs.

当我们开始时，我们的目标不仅仅是支持文本编辑器的需求。我们还希望创建一个简单明了的框架，让人们能够使用网络技术来构建具有所有原生功能的跨平台桌面应用。

🌐 When we got started, our goal wasn't just to support the needs of a text editor. We also wanted to create a straightforward framework that would allow people to use web technologies to build cross-platform desktop apps with all of the native trimmings.

在短短两年的时间里，Electron 发展迅速。它现在包括自动应用更新、Windows 安装程序、崩溃报告、通知以及其他有用的原生应用功能——所有这些都可以通过 JavaScript API 访问。而且我们还有更多计划。我们打算从 Atom 中提取更多库，使使用 Web 技术构建原生应用变得尽可能简单。

🌐 In two years, Electron has grown immensely. It now includes automatic app updates, Windows installers, crash reporting, notifications, and other useful native app features — all exposed through JavaScript APIs. And we have more in the works. We plan to extract even more libraries from Atom to make building a native app with web technologies as easy as possible.

到目前为止，个人开发者、早期创业公司和大型公司都在使用 Electron 构建应用。他们创建了各种各样的应用——包括聊天应用、数据库浏览器、地图设计工具、协作设计工具以及移动原型应用。

🌐 So far, individual developers, early-stage startups, and large companies have built apps on Electron. They've created a huge range of apps — including chat apps, database explorers, map designers, collaborative design tools, and mobile prototyping apps.

查看新的 electronjs.org，了解更多人们用 Electron 构建的应用，或者浏览 文档，了解你还能制作哪些其他东西。

🌐 Check out the new electronjs.org to see more of the apps people have built on Electron or take a look at the docs to learn more about what else you can make.

如果你已经开始使用，我们非常希望与你聊聊你在 Electron 上开发的应用。请发送邮件至 info@electronjs.org 告诉我们更多信息。你还可以关注新的 @ElectronJS 推特账号，以保持与项目的联系。

🌐 If you've already gotten started, we'd love to chat with you about the apps you're building on Electron. Email info@electronjs.org to tell us more. You can also follow the new @ElectronJS Twitter account to stay connected with the project.

⚡ 💙 🔌