Vue 学习之 Electron 使用github 自动更新

1.安装electron-updater

• 使用yarn

yarn add electron-updater

• 或者使用 npm

npm install electron-updater

2.使能 发布到Github 功能

添加 publish: [‘github’] 到你在vue.config.js 中 Electron Builder 的配置

module.exports = {
  pluginOptions: {
    electronBuilder: {
      builderOptions: {
        publish: ['github']//此处写入github 就好，不用添加其他内容
      }
    }
  }
}

3.在background.(js|ts) 中添加检测更新

...
+  import { autoUpdater } from "electron-updater"
...

if (process.env.WEBPACK_DEV_SERVER_URL) {
    // Load the url of the dev server if in development mode
    win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
    if (!process.env.IS_TEST) win.webContents.openDevTools()
  } else {
    createProtocol('app')
    // Load the index.html when not in development
    win.loadURL('app://./index.html')
 1.   autoUpdater.checkForUpdatesAndNotify()
  }
...

4.生成GitHub access token

1. https://github.com/settings/tokens/new 先去生成 token，然后自己复制一下，记得存到记事本，因为只会出现一次
2. 加入环境变量
   On macOS/linux:

export GH_TOKEN="<YOUR_TOKEN_HERE>"

On Windows, run in powershell:

[Environment]::SetEnvironmentVariable("GH_TOKEN","<YOUR_TOKEN_HERE>","User")

然后重启 powershell ，环境变量才会有效

5.添加脚本

然后在package.json中添加

 "scripts": {
     "publish": "vue-cli-service electron:build --win --x64 -p always"
 }

6.上传GitHub 并发布

上传GitHub

npm run publish

or

With Yarn:

yarn electron:build -p always

or with NPM:

npm run electron:build -- -p always

发布

在GitHub中打开您的仓库，然后单击发布选项卡。您应该看到包含所有二进制文件的新版本的草稿。发布此版本，以便用户可以对其进行更新。

7.检查更新

安装您的应用程序，然后运行它。您尚未收到更新通知，因为这是最新版本。您必须通过增加中的version字段来发布新版本package.json，然后重复前面的3个步骤。现在，您的旧应用应该会向您发送更新通知。

源码GitHub
参考
https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/recipes.html#auto-update
https://www.jianshu.com/p/f6726ada78ff