使用 electron-updater 自動更新應用
摘要：
前端工程師可以使用 Electron 非常方便的編寫出 PC 端應用，而應用更新的方式也有很多，詳細可見更新應用程式。
我的專案是基於 electron-vue 搭建的，構建打包生成安裝包，則用的是 electron-builder，所以更新自然選擇 electron-updater...
前端工程師可以使用 Electron 非常方便的編寫出 PC 端應用，而應用更新的方式也有很多，詳細可見更新應用程式。
我的專案是基於 electron-vue 搭建的，構建打包生成安裝包，則用的是 electron-builder，所以更新自然選擇 electron-updater。
- 要實現自動更新，首先需要安裝 electron-updater 包：
yarn add [email protected] -D 複製程式碼
這裡有個坑，如果你跟我一樣使用的 electron-vue 搭建的專案，那 electron 的版本應該也是 2.x，截止到 2018-12-16，electron-vue 使用的依然是 "electron": "^2.0.4"，如果你直接安裝最新的 electron-updater，那你的更新程式是會報錯的。
所以這裡有兩個方案，一個是升級你的 electron，還有一個是安裝 3.x 的 electron-updater。
- 然後對 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/">GitHub 等進行免費託管，詳細參考文件。
- 建立檔案服,測試環境可以直接用 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
這個資料夾裡，這樣我們就可以通過ofollow,noindex">http://10.0.1.42:88/latest.yml
訪問到latest.yml
這個檔案。
所以在 package.json 裡的配置中，publish 下的 url 項就直接寫http://10.0.1.42:88/ 就行。
- 最後，檢查更新的程式碼
程式碼我就不寫了，百度和文件裡都有，這個比較簡單，你想要自動檢查更新還是使用者手動檢查更新，都看你心情。