跳转到主内容

API Changes Coming in Electron 1.0

· 阅读时间:约 4 分钟

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.


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.

弃用警告

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.

使用内置模块的新方式

内置模块现在分成一个模块,而不是分成独立模块, 这样您就可以使用它们 而不会与其他模块 相冲突:

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

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.

An easier way to use the remote module

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');

Splitting the ipc module

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:

// 在主进程中.
var ipcMain = require('electron').ipcMain;
// In renderer process.
var ipcRenderer = require('electron').ipcRenderer;

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 的标准化

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 });

Following DOM's conventions for API names

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

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.

Changes to Tray's event names

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

Mac App Store and Windows Auto Updater on Electron

· 阅读时间:约 2 分钟

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


Mac App Store Support

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

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-.

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

Windows Auto Updater

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.

Related Pull Request: electron/electron#1984

Electron 有哪些新功能

· 阅读时间:约 3 分钟

Electron近期收到了一些有趣的更新和趣谈,摘要如下:


Electron 现在已经更新了 Chrome 45,截止为 v0.32.0。 其他更新包含...

更好的帮助文档

新文档

为了让文档看起来、读起来更舒适,我们标准化了文档记录,并对其结构进行了调整。 同时,对如日语和韩语等语言内容,还有社区贡献的文档翻译。

相关的拉取请求: electron/electron#2028electron/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。

相关的拉取请求: electron/electrony#2817

node-pre-gyp

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

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

ARM支持

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

相关问题: atom/libchromiumcontent#138, electron/electronic #2094, electron/electronic #366

MacOS X 10.10 “Yosemite” 式的无边框窗口

无边框窗口

一个由@jaanus提供的、已被合并的补丁允许Electron像其他内置的原生OS X程序一样创建包含在OS X “Yosemite” 后系统集成的红绿灯式按钮的无边框窗口。

相关的拉取请求: electron/electrony#2776

谷歌 Summer of Code 项目:打印支持

谷歌Summer of Code项目后,我们合并了 @hokein 的补丁,以改进打印支持。 并添加打印页面到 PDF 文件的能力。

相关问题: electron/electron#2677, electron/electron#1935, electron/electron#1532, electron/electron#805, electron/electron#1669, electron/electron#1835.

Atom

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

Talks

GitHub用户Amy PalamountainNordic.js上为Electron做了很好的介绍。 她还创建了 electron-accelerator 库。

Amy Palomountain:用 Electron 构建本地应用程序

也在Atom团队中的Ben OgleYAPC Asia上作了一段关于Electron的演讲:

Ben Ogle:使用互联网技术构建桌面应用

Atom团队成员Kevin Sawicki等人在湾区Electron用户组近期的会面上作了关于Electron的演讲。 这些视频已被发布,这里有一些:

Kevin Sawicki:Electron的历史

Ben Gotow:让网页应用感觉是原生的

Electron Meetup at GitHub HQ

· 阅读时间:约 1 分钟

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!


Talks

  • Jonathan Ross and Francois Laberge from Jibo will share how they use Electron to animate a robot.
  • Jessica Lord will talk about building a teaching tool, Git-it, on Electron.
  • Tom Moor will talk about the pros and cons of building video and screen sharing on Electron with speak.io.
  • Ben Gotow will preview N1: The Nylas Mail Client and talk about developing it on Electron.

详细信息

electron-meetup-office-2

Electron 文档

· 阅读时间:约 4 分钟

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.


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 仓库中获取文档。 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

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

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:

Tests help us know that all the bits and pieces landed as expected.

Jekyll

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

前页附属资料

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'
---

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

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/' }

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 }}
---

布局

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 %}

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 %}

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 is now Electron

· 阅读时间:约 2 分钟

Atom Shell is now called Electron. 您可以了解更多关于 Electron 以及人们正在其新家居 electron 的构建。


electron

Electron 是我们原先为 Atom 编辑器 构建的跨平台应用程序外壳,以处理Chromium/Node.js 事件循环集成和原生API。

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.

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.

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. rg 查看更多开发者们基于Electron 构建的应用,或查看 文档 以了解更多关于您可以做什么的信息。

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.

💙 🔌