electron 自动更新_在Electron中快速，轻松地进行自动更新

electron 自动更新

by Andrea Zanin

由Andrea Zanin

在Electron中进行快速，轻松的自动更新 (Quick and painless automatic updates in Electron)

Let’s face it: most users won’t go back to your site and download the updates for your brand new Electron app. Instead, you should put in place some kind of automatic update system.

面对现实：大多数用户都不会返回您的网站并为您全新的Electron应用程序下载更新。 相反，您应该安装某种自动更新系统。

Unfortunately, the online documentation for this is neither very easy to find nor follow. Here, I will guide you through a quick process to setup an auto-updater, using GitHub as a host.

不幸的是，关于此的在线文档既不容易查找也不遵循。 在这里，我将指导您完成一个快速过程，以GitHub为主机，设置自动更新程序。

设置存储库 (Setting up the repository)

To publish on your behalf, electron-builder needs a GitHub access token. If you don’t know what these are or how to create one, check out GitHub’s quick guide.

为了代表您发布，electron-builder需要一个GitHub访问令牌。 如果您不知道这些是什么或如何创建它们，请查看GitHub的快速指南 。

Electron-builder needs a token with access to the repo scope. Create one as described in the link, and copy it somewhere safe (you will only be shown the token once!).

Electron-builder需要具有可访问回购范围的令牌。 按照链接中的说明创建一个，然后将其复制到安全的位置(您只会看到一次令牌！)。

设置图书馆 (Setting up the library)

We are going to use electron-builder to package our app, so let’s start by installing it:

我们将使用电子构建器来打包我们的应用程序，因此让我们从安装它开始：

npm install electron-builder --save-dev

Let’s also install electron-updater to handle the automatic updates:

我们还安装电子更新程序来处理自动更新：

npm install electron-updater --save

Then, we need to configure our build. In the package.json add this snippet:

然后，我们需要配置构建。 在package.json添加以下代码段：

Let’s analyze this bit by bit:

让我们对此进行一点点分析：

• The repository link is pretty self explanatory — just remember to replace it with yours!

  repository链接很容易解释-请记住要用您的替换它！

• The build script will build your app locally, without publishing.

  build脚本将在本地构建您的应用程序，而无需发布。

• The ship script will build and publish your app.

  ship脚本将构建并发布您的应用程序。

Note for React developers: electron-builder and create-react-app have some conflicts by default. I created a generator that sets up an electron+react+electron-builder app with zero configuration needed. You can find it here.

对React开发人员的说明 ：默认情况下，electronic-builder和create-react-app有一些冲突。 我创建了一个生成器，该生成器以零配置设置了一个electronic + react + electron-builder应用程序。 你可以在这里找到它。

Now create a file calledelectron-builder.yml with the following content:

现在创建一个名为electron-builder.yml的文件，其内容如下：

• The appId is the name of your application in the Operating System register. You can choose it freely.

  appId是您在操作系统寄存器中的应用程序的名称。 您可以自由选择。

• The provider is the platform that will store your application’s installer.

  provider是将存储您的应用程序安装程序的平台。

• The token is the GitHub access token. Substitute it with the one you created earlier.

  该token是GitHub访问令牌。 用您先前创建的替代它。

Remember to add this file to the .gitignore so that you don’t share your token with the whole world! ;)

切记将此文件添加到.gitignore以免与全世界共享令牌！ ;)

处理更新逻辑 (Handling the update logic)

Now we need to configure the update logic in our Electron app. Integrate this in your entry file (usually index.js or electron.js). If you are creating a brand new app, then you can simply copy-paste the code below:

现在，我们需要在Electron应用程序中配置更新逻辑。 将其集成到您的条目文件中(通常是index.js或electron.js )。 如果要创建全新的应用程序，则只需复制粘贴以下代码即可：

IPC modules are the standard way to send messages between processes in Electron. You can learn more about them here.

IPC模块是在Electron中的进程之间发送消息的标准方法。 您可以在此处了解有关它们的更多信息。

The code is pretty self-explanatory and handles the Electron side of the update. Now we have to notify the user.

该代码非常不言自明，可以处理更新的电子方面。 现在我们必须通知用户。

Here is an example of a HTML page. It displays a button whose caption is either “no updates ready” or “new version ready!”. When the button is clicked, a method is called which tells Electron to quit and install the new updates.

这是HTML页面的示例。 它显示一个按钮，其标题为“未准备好更新”或“准备好新版本！”。 单击该按钮时，将调用一个方法，该方法告诉Electron退出并安装新的更新。

最后，运送 (And finally, ship)

When you are ready to publish, edit the version field in the package.jsonand run the following command:

准备发布时，请编辑package.json的version字段并运行以下命令：

npm run ship

Go to your repository’s GitHub page and click ‘releases’ (it’s on the same line as ‘commits’ and ‘branch’). There, you will find a draft release. Click ‘edit’ and then ‘publish release’.

转到存储库的GitHub页面，然后单击“发布”(与“提交”在同一行) 和“分支”)。 在这里，您会找到一个发布草案。 点击“修改” 然后“发布发布”。

Don’t panic if the button shows “no updates ready” when you start the app. This will only change after it has finished downloading the new version.

启动应用程序时，如果按钮显示“没有更新准备就绪”，请不要惊慌。 只有在完成新版本的下载后，这种情况才会改变。

If you want to use a functioning project to learn more and get started, you can clone this example repository.

如果要使用功能正常的项目来了解更多信息并开始使用，可以克隆此示例存储库 。

If you found this article helpful, be sure to clap ?.

如果您发现本文有帮助，请务必鼓掌？

翻译自: https://www.freecodecamp.org/news/quick-painless-automatic-updates-in-electron-d993d5408b3a/

electron 自动更新