使用 electron-updater 自动更新应用

前端工程师可使用 Electron 很是方便的编写出 PC 端应用，而应用更新的方式也有不少，详细可见更新应用程序。

个人项目是基于 electron-vue 搭建的，构建打包生成安装包，则用的是 electron-builder，因此更新天然选择 electron-updater。

1. 要实现自动更新，首先须要安装 electron-updater 包：

yarn add electron-updater@3.1.5 -D
复制代码

这里有个坑，若是你跟我同样使用的 electron-vue 搭建的项目，那 electron 的版本应该也是 2.x，截止到 2018-12-16，electron-vue 使用的依然是 "electron": "^2.0.4"，若是你直接安装最新的 electron-updater，那你的更新程序是会报错的。

因此这里有两个方案，一个是升级你的 electron，还有一个是安装 3.x 的 electron-updater。

2. 而后对 package.json 作一点小改动：

...
  "build": {
    "productName": "xingsanhao",
    "appId": "com.example.yourapp",
    "directories": {
      "output": "build"
    },
    "publish": [
      {
        "provider": "generic",
        "url": "http://10.0.1.42:88/"
      }
    ],
    "files": [
      "dist/electron/**/*"
    ],
    ...
复制代码

build 里的内容是 electron-builder 打包须要的配置，如今咱们须要在里面加入 electron-updater 须要的配置 publish， 我这里选用的是普通服务器，固然你也可使用 GitHub 等进行免费托管，详细参考文档。

3. 建立文件服,测试环境能够直接用 express 快速搭建：

// app.js

var express = require('express')
var fs = require('fs')
const path = require('path')
var app = express()

app.use(express.static(path.join(__dirname, './client')))

var server = app.listen(88, function () {
  var host = server.address().address;
  var port = server.address().port;

  console.log('Example app listening at http://%s:%s', host, port);
});
复制代码

打包生成的安装包和 latest.yml 文件就放在 client 这个文件夹里，这样咱们就能够经过 http://10.0.1.42:88/latest.yml 访问到 latest.yml 这个文件。

因此在 package.json 里的配置中，publish 下的 url 项就直接写 http://10.0.1.42:88/ 就行。

4. 最后，检查更新的代码

代码我就不写了，百度和文档里都有，这个比较简单，你想要自动检查更新仍是用户手动检查更新，都看你心情。