electron热更新与windows下的安装包
帮朋友公司做了点东西,他说有很多bug,我一看,基本问题都是浏览器兼容引起的,而electron内带Chromium内核,正好一直想尝试下electron,所以研究了一波。这里只是简单的使用electron作为壳,把自己的项目嵌进去,更多深入研究以后再来。
打包自己的项目
这里没啥说的自己的项目打包下来,类似下面
快速开始electron
上手electron,官方提供了一个非常好的快速上手实例"electron-quick-start"。
- git clone https://github.com/electron/electron-quick-start
- cd electron-quick-start
- npm install
- 把自己的项目拷进去
- npm run start就启动起来了
- npm run packager就打包出来了
热更新
- 因为Chromium的缘故,即使很小的项目打包出来也有120M左右,如果给客户使用,不可能每次有点改动就让客户重新安装,显然我们需要热更新。
- 热更新的原理:每次启动程序我们就去拿本地的版本号和服务器上的版本号做对比,如果不一致就去请求资源,下载下来更新本地文件。
- 首先我们观察打包出来的文件,发现原始文件都放在resources/app下面的,也即是说我们下载下来的文件直接覆盖到resources/app下就可以达到更新了。
- 这里我推荐七牛云,免费的可以使用10G内存,我们把更新资源放上去,需要版本号package.json和更新包dist.zip
- 然后改写electron配置main.js,加入检测更新的代码
/**
* 检测更新
*/
// const baseUrl = "./";
const baseUrl = "./resources/app/";
const fileUrl = "http://pm72qibzx.bkt.clouddn.com/";//这里需要修改为自己的资源外网
(function () {
return new Promise((resolve, reject) => {
request(
{
url: `${fileUrl}package.json?v=${new Date().getTime()}`,//请求package.json,与本地对比版本号
},
(error, res, body) => {
try {
if (error || res.statusCode !== 200) {
throw '更新版本号失败,请联系管理员';
}
const json = JSON.parse(body);
const { version, description } = json;
const localVersion = electron.app.getVersion();
// console.log(version, localVersion)
if (version != localVersion) {
mainWindow.webContents.send('updating', '更新中')
console.log('need update')
dialog.showMessageBox({
type: 'info',
title: '发现新版本',
message: '请点击按钮进行更新,预计持续几分钟,期间请不要操作,更新后会自动重启',
buttons: ['马上更新']
},
// (index) => {
// if (index == 0) {
// mainWindow.setProgressBar(0.5)
// } else {
// }
// }
)
mainWindow.setProgressBar(0.5);
downLoad()
.then(() => {
console.log('update success')
//重写版本号到本地
fs.readFile(`${baseUrl}package.json`, function (err, data) {
if (err) {
return console.error(err);
}
let newData = JSON.parse(data);
newData.version = version;
fs.writeFile(`${baseUrl}package.json`, JSON.stringify(newData), function (err) {
if (err) {
return console.error(err);
}
// 重启
app.relaunch({ args: process.argv.slice(1) });
app.exit(0);
});
});
})
} else {
console.log('no update')
}
} catch (err) {
reject(err);
}
})
})
})()
/**
* 更新
*/
const downLoad = () => {
return new Promise((resolve, reject) => {
const stream = fs.createWriteStream(`${baseUrl}temp/dist.zip`);
const url = `${fileUrl}dist.zip?v=${new Date().getTime()}`;
request(url).pipe(stream).on('close', () => {
const unzip = new adm_zip(`${baseUrl}temp/dist.zip`); //下载压缩更新包
unzip.extractAllTo(`${baseUrl}`, /*overwrite*/true); //解压替换本地文件
resolve()
});
})
}
windows下的安装包
- 这里使用electron-winstaller
- 配置在build.js
resultPromise = electronInstaller.createWindowsInstaller({
appDirectory: path.join('./electron/ElectronTest-win32-x64'), //入口
outputDirectory: path.join('./installer/installer64'), //出口
authors: 'yyt',
exe: 'ElectronTest.exe', //名称
setupIcon: path.join('icon.ico'),//安装图标,必须本地
iconUrl: 'http://pm72qibzx.bkt.clouddn.com/icon.ico',//程序图标,必须url
noMsi: true,
});
- node build.js 打包成win安装包
完成
- 完成安装后,玩耍吧
源码
- 删除electron和install,防止老文件
- 考入自己项目文件到跟目录,覆盖index.html
- cnpm i 或者npm i
- 修改main.js中fileUrl为自己的更新包资源地
- 修改build.js中的安装包名称,图标等
- npm run packager 打包
- 注意:需要先进入electron项目,‘比如D:\phpStudy\WWW\others\electron-test\electron\ElectronTest-win32-x64\resources\app’,安装cnpm i request adm-zip
- node build.js 打包成win安装包
最后
大家好,这里是「 TaoLand 」,这个博客主要用于记录一个菜鸟程序猿的Growth之路。这也是自己第一次做博客,希望和大家多多交流,一起成长!文章将会在下列地址同步更新……
个人博客:www.yangyuetao.cn
小程序:TaoLand
electron热更新与windows下的安装包的更多相关文章
- Windows下pip安装包报错:Microsoft Visual C++ 9.0 is required Unable to find vcvarsall.bat
刚在机器上windows环境下装上pip方便以后安装包的时候使用,谁知道第一次使用pip安装asyncio的时候就报错. 在Windows7x64下使用pip安装包的时候提示报错:Microsoft ...
- 【python】 Windows下pip安装包报错:Microsoft Visual C++ 9.0 is required Unable to find vcvarsall.bat
刚在机器上windows环境下装上pip方便以后安装包的时候使用,谁知道第一次使用pip安装asyncio的时候就报错. 在Windows7x64下使用pip安装包的时候提示报错:Microsoft ...
- (转)Windows下pip安装包报错:Microsoft Visual C++ 9.0 is required Unable to find vcvarsall.bat
刚在机器上windows环境下装上pip方便以后安装包的时候使用,谁知道第一次使用pip安装asyncio的时候就报错. 在Windows7x64下使用pip安装包的时候提示报错:Microsoft ...
- windows下 Python 安装包的配置
1.下载安装 Pythonpython-2.7.2.msi http://www.python.org/download/如下载 Python 2.7.2,安装目录为 C:\Python27 2.添 ...
- windows下pip安装包权限的问题
md哔了狗了,把scipy弄崩了,还顺带把numpy弄崩了... 然后安装包一直权限不允许: 于是按照下面这篇博客以管理员运行cmd,结果还是没卵用 http://www.cnblogs.com/li ...
- Linux下一键安装包的基础上安装SVN及实现nginx web同步更新
Linux下一键安装包的基础上安装SVN及实现nginx web同步更新 一.安装 1.查看是否安装cvs rpm -qa | grep subversion 2.安装 yum install sub ...
- linux下各安装包的安装方法
<转>linux下各安装包的安装方法 一.rpm包安装方式步骤: 1.找到相应的软件包,比如soft.version.rpm,下载到本机某个目录: 2.打开一个终端,su -成root ...
- Windows7环境下Composer 安装包的Cache目录位置
http://segmentfault.com/a/1190000000355928 https://getcomposer.org/doc/ 要说Composer的用法,以后再说,现在只记录wind ...
- RHEL6下获取安装包(RPM)而不安装的方法
RHEL6下获取安装包(RPM)而不安装的方法 有时候我们只能在某个机器上网获得RPM安装包,如何将RPM包在不能上网的内网机器安装,就需要能将安装包下载到本地而不安装,然后再把这些包复制到内网机器, ...
随机推荐
- 7dynamic_cast用法
已知下面的class层次,其中每一个class都定义有一个default constructor和一个virtual destructor: class X{……}; class A{……}; cla ...
- poj2892
题解: 答案=后缀-前缀-1 如果被轰了,那么就时0 在一开始加入0,n+1,保证有前缀后缀 代码: #include<cstdio> #include<cmath> #inc ...
- Nexcel的行列,和单元格坐标
book.Sheets[1].UsedRange.Rows.Count 行数从1开始 book.Sheets[1].UsedRange.LastCol 从0开始 book.Sheets[1].Cell ...
- EhLib的行Checkbox
方法1 http://www.cnblogs.com/jupt/p/4291902.html 在Indicator中添加动态Checkbox,无需绑定数据源,支持全选 - Ehlib学习(二) 先 ...
- Flask初级(二)为flash创建路由,访问路径。
Project name :Flask_Plan 上一篇文章,我们创建了默认的flask项目,也可以运行起来. 但是只有一个首页,只显示一个hello world. 现在我们创建访问路由,也就是访问地 ...
- Java实现冒泡排序、折半查找
1.冒泡排序 public class BubbleSort{ public static void main(String[] args){ int score[] = {67, 69, 75, 8 ...
- 【数据库】MFC ODBC(三)
4.SQL查询 记录集的建立实际上是一个查询过程,SQL的SELECT语句用来查询数据源.在建立记录集时,CRecordset会根据一些参数构造一个SELECT语句来查询数据源,并用查询的结果创建记录 ...
- OC基础:属性.点语法.KVC 分类: ios学习 OC 2015-06-24 17:24 61人阅读 评论(0) 收藏
属性:快速生成setter和getter 属性也包括:声明和实现 1.属性的声明写在.h中 格式:@property 数据类型 变量名; 如果实例变量一致的时候,属性的声明可以合并,每一个属性之间使用 ...
- xgboost 简单测试
#coding=utf8 import pandas as pd from sklearn.model_selection import train_test_split from sklearn.f ...
- stm32 SPI介绍和配置
SPI是一种高速的,全双工同步的通信总线,在芯片管脚上占用了四根线,节约了芯片的管脚,同时为PCB的布局节省了空间,提供了方便,因此越来越多的芯片集成了这种通信协议,STM32也就有了SPI接口. 有 ...