This article is a supplement to the application documentation. I just started using electron-forge but there is no related tutorial, so give up.
1. First learn to use electron-builder for packaging.
2. Then add build content in package.json
{
"name": "ds",
"version": "1.0.0",
"description": "A minimal Electron application",
"main": "src/main.js",
"scripts": {
"dist": "electron-builder -wm",
"start": "electron ."
},
"build": {
"appId": "com.dingshang.app",
"publish": [
{
"provider": "generic",
"url": "http://www.xxx.com/static/dist/"
}
],
"win": {
"target": [
"nsis",
"zip"
],
"icon": "src/icon.png"
}
},
"dependencies": {
"electron-updater": "^2.21.4"
}
}
3. Adding this online tutorial in main.js is import but it will prompt an error.
const autoUpdater = require('electron-updater').autoUpdater
const ipcMain = require('electron').ipcMain
const uploadUrl='http://www.d-shang.com/static/dist/'
// 检测更新,在你想要检查更新的时候执行,renderer事件触发后的操作自行编写
function updateHandle() {
let message = {
error: '检查更新出错',
checking: '正在检查更新……',
updateAva: '检测到新版本,正在下载……',
updateNotAva: '现在使用的就是最新版本,不用更新',
};
const os = require('os');
autoUpdater.setFeedURL(uploadUrl);
autoUpdater.on('error', function (error) {
console.log(error);
sendUpdateMessage(message.error)
});
autoUpdater.on('checking-for-update', function () {
console.log(message);
sendUpdateMessage(message.checking)
});
autoUpdater.on('update-available', function (info) {
console.log(message);
sendUpdateMessage(message.updateAva)
});
autoUpdater.on('update-not-available', function (info) {
sendUpdateMessage(message.updateNotAva)
});
// 更新下载进度事件
autoUpdater.on('download-progress', function (progressObj) {
mainWindow.webContents.send('downloadProgress', progressObj)
})
autoUpdater.on('update-downloaded', function (event, releaseNotes, releaseName, releaseDate, updateUrl, quitAndUpdate) {
ipcMain.on('isUpdateNow', (e, arg) => {
console.log(arguments);
console.log("开始更新");
//some code here to handle event
autoUpdater.quitAndInstall();
});
mainWindow.webContents.send('isUpdateNow')
});
ipcMain.on("checkForUpdate",()=>{
//执行自动更新检查
autoUpdater.checkForUpdates();
})
}
// 通过main进程发送事件给renderer进程,提示更新信息
function sendUpdateMessage(text) {
mainWindow.webContents.send('message', text)
}
4. You also need to call the method in createWindow() of main.js
function createWindow () {
//这个方法要调用
updateHandle();
}
5. Set up monitoring index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello World!</title>
</head>
<body>
<h1>Hello World!</h1>
自动更新
</body>
</html>
<script src="./script/jquery-1.11.0.min.js"></script>
<script>
const ipcRenderer = require('electron').ipcRenderer
ipcRenderer.send("checkForUpdate");
ipcRenderer.on("message", (event, text) => {
console.log(arguments);
this.tips = text;
});
ipcRenderer.on("downloadProgress", (event, progressObj)=> {
console.log(progressObj);
this.downloadPercent = progressObj.percent || 0;
});
ipcRenderer.on("isUpdateNow", () => {
ipcRenderer.send("isUpdateNow");
});
</script>
At this point, all is completed, debug npm start to see if it works
Citing documents
https://segmentfault.com/a/1190000012904543