如何将electron框架开发的软件包打包成单一exe文件
前言:研究electron自动更新的时候,在electron的官方文档auto-updater 中,提到了在几个平台mac,linux,windows下electron 的自动更新方法,其中windsow平台上面,文章中建议先用grunt-electron-installer 模块来创建windows安装包,grunt这个工具是由Squirrel集成的。进而了解下Squirrel这个工具,
一个可以用来给electron应用的安装更新卸载添加快捷方式的工具。本文主要提及如何在windows平台下,用Squirrel创建electron的.exe安装包。
创建nuget包
我们的方法是使用nuget工具创建Nuget包,再使用Squirrel工具创建.exe。
1.下载squirrel.exe和nuget.exe,也可以选择直接安装Squirrel.Windows (需要有vitual
studio环境)。
2.新建文件夹如my-build,把下载好的squirrel.exe,nuget.exe和setup.exe
放进去,在文件夹放入我们未打包的electron应用,如下图:
4.在my-build根目录中,打开命令行执行nuget spec
如下图:
生成 spec包初始文件
5.编辑器打开 Package.nuspec,按照自己项目的需要编辑这个文件,如下图:
这里需要注意:根据Squirrel文档说明,target folder 属性需要设置为lib/net45,否则并没有用;标签用来制定未来的exe的icon。
5.用下面的命令创建一个nuget包,
nuget pack Package.nuspec
如下图:
之后在目录中会出现这个包
命名规则就是..nupkg
创建安装程序
把应用程序打包成nuget包之后,就可以用squirrel创建一个安装程序了。在根目录打开命令行,执行以下命令:
squirrel --releasify ..nupkg
这个时候命令行中没有任何提示。但是别慌,编译一段时间后程序会创建一个release文件夹,里面有三个文件,nuget包,RELEASES 文件和安装文件Setup.exe。如下图:
如果没有出现这三个文件,可以查看目录中的SquirrelSetup.log,根据里面的报错,来进行调试。
注意上面这条squirrel 命令,可以用来设置setup.exe在安装过程中用传统icon还是用自定义的图片文件。使用Squirrel --help可以查看更多帮助
发布应用和安装应用
把上一步生成的setup.exe发送给想要安装这个应用的用户,就可以了。
最终应用会被安装在C:\Users\Administrator\AppData\Local\[appname] 文件夹中,注意Squirrel 的日志文件也存在目录中,调试安装问题的时候非常有用。
双击我们的setup.exe进行安装app的测试,如果中途有任何出错,在
C:\Users\Administrator\AppData\Local\SquirrelTemp 里面可以看到安装日志。如下图:
安装之后打开C:\Users\Administrator\AppData\Local 目录,可以看到app安装在这里,如下图:
自动创建快捷方式
进入我们安装之后的文件夹,命令行进入C:\Users\Administrator\AppData\Local\[your appname],执行 Update.exe --help ,可以看到
不知道从上图你有没有得到什么提示,反正我发现了,在命令行手动创建快捷方式的命令是Update.exe --createshortcut electron\electron.exe -i [your ico toute]\app.ico
所以,如果我们想让应用在安装过程中静默地创建好快捷方式,那就需要在app的安装之后相反设法执行这句代码。
因为我们的.exe会在安装之后自动打开程序,所以我在程序的入口main.js,添加sqruieel事件的监听就好了。如下图:
我顺便把程序卸载时,删除快捷方式的监听事件也写了进去。还有程序的更新和删除事件监听,但是这两个事件,我还没有进行测试。
更新应用
其实我一直很想做增量更新,在这里我的更新方法有两个,第一是在程序的入口添加js,发送请求到服务器,拉取更改文件进行本地替换,但是如果是node_module依赖包的更改,这个方法并不可行。第二个方法比较安全而且快捷通过发布一个版本号不同的exe,如下:1.在这个创建安装程序的步骤2中,我们把程序代码都复制到了这个文件夹里面,如下图:
如果后续我们的程序要进行更新,首先我们需要把更改的文件直接复制替换到这个文件夹。
2.打开Package.nuspec,编辑version标签
3.参考本文种中创建安装程序部分的步骤2-4,重新生成setup.exe,发布应用。
通过执行setip.exe安装,程序会自动删除之前的应用,但是我并不清楚,sqruieel 是进行了增量替换,还是将之前的整个应用进行删除,再重新安装。
创建自定义安装包
在上一步,我们已经把自己的exe发布出来了,但是如果没有自定义名字跟icon,好像还不够酷,所以我们需要创建自定义的安装文件。
1.下载安装 Resource
Hacker
2.打开这个项目目录,在electron.exe上面右键
出现菜单,点击 Open using Rescource Hacker。
3.Resource Hacker应用运行之后中,在以下界面中选择Icon,然后在工具栏里面选择Action,Replace
Icon,如下图:
然后选择自己想要替换的.ico文件就好
4.这其实并不够,我们还需要更换exe里面的版本信息,打开Version
Info,把FileDescription和ProductName改成我们自己的项目名称,最好把SquirrelAwareVersion也更改一下,毕竟是版本号。
5.做完这些之后,我们需要按照之前的步骤,在命令行中输入
nuget pack Package.nuspec
重新生成nuget包,然后再使用
squirrel --releasify ..nupkg 命令创建安装文件。
6.打开之后生成的releases文件夹,参考本文种中创建安装程序部分的步骤2-4,对setup.exe进行自定义。
最后,一个可以自动更新又安装便捷,还有我们自己的酷酷的图标跟名字的应用就生成拉!
第一步,配置 package.json 第二步,编译 build --win --ia32 builder 支持编译成多种格式等等功能
前言:研究electron自动更新的时候,在electron的官方文档auto-updater 中,提到了在几个平台mac,linux,windows下electron 的自动更新方法,其中windsow平台上面,文章中建议先用grunt-electron-installer 模块来创建windows安装包,grunt这个工具是由Squirrel集成的。进而了解下Squirrel这个工具,一个可以用来给electron应用的安装更新卸载添加快捷方式的工具。本文主要提及如何在windows平台下,用Squirrel创建electron的.exe安装包。
创建nuget包
我们的方法是使用nuget工具创建Nuget包,再使用Squirrel工具创建.exe。
1.下载squirrel.exe和nuget.exe,也可以选择直接安装Squirrel.Windows (需要有vitual
studio环境)。
2.新建文件夹如my-build,把下载好的squirrel.exe,nuget.exe和setup.exe
放进去,在文件夹放入我们未打包的electron应用,如下图:
4.在my-build根目录中,打开命令行执行nuget spec
如下图:
生成 spec包初始文件
5.编辑器打开 Package.nuspec,按照自己项目的需要编辑这个文件,如下图:
这里需要注意:根据Squirrel文档说明,target folder 属性需要设置为lib/net45,否则并没有用;<iconUrl>标签用来制定未来的exe的icon。
5.用下面的命令创建一个nuget包,
nuget pack Package.nuspec
如下图:
之后在目录中会出现这个包
命名规则就是<my_app_name>.<version>.nupkg
创建安装程序
把应用程序打包成nuget包之后,就可以用squirrel创建一个安装程序了。在根目录打开命令行,执行以下命令:
squirrel --releasify <my_app_name>.<version>.nupkg
这个时候命令行中没有任何提示。但是别慌,编译一段时间后程序会创建一个release文件夹,里面有三个文件,nuget包,RELEASES 文件和安装文件Setup.exe。如下图:
如果没有出现这三个文件,可以查看目录中的SquirrelSetup.log,根据里面的报错,来进行调试。
注意上面这条squirrel 命令,可以用来设置setup.exe在安装过程中用传统icon还是用自定义的图片文件。使用Squirrel --help可以查看更多帮助
发布应用和安装应用
把上一步生成的setup.exe发送给想要安装这个应用的用户,就可以了。
最终应用会被安装在C:\Users\Administrator\AppData\Local\[appname] 文件夹中,注意Squirrel 的日志文件也存在目录中,调试安装问题的时候非常有用。
双击我们的setup.exe进行安装app的测试,如果中途有任何出错,在
C:\Users\Administrator\AppData\Local\SquirrelTemp 里面可以看到安装日志。如下图:
安装之后打开C:\Users\Administrator\AppData\Local 目录,可以看到app安装在这里,如下图:
自动创建快捷方式
进入我们安装之后的文件夹,命令行进入C:\Users\Administrator\AppData\Local\[your appname],执行 Update.exe --help ,可以看到
不知道从上图你有没有得到什么提示,反正我发现了,在命令行手动创建快捷方式的命令是Update.exe --createshortcut electron\electron.exe -i [your ico toute]\app.ico
所以,如果我们想让应用在安装过程中静默地创建好快捷方式,那就需要在app的安装之后相反设法执行这句代码。
因为我们的.exe会在安装之后自动打开程序,所以我在程序的入口main.js,添加sqruieel事件的监听就好了。如下图:
我顺便把程序卸载时,删除快捷方式的监听事件也写了进去。还有程序的更新和删除事件监听,但是这两个事件,我还没有进行测试。
更新应用
其实我一直很想做增量更新,在这里我的更新方法有两个,第一是在程序的入口添加js,发送请求到服务器,拉取更改文件进行本地替换,但是如果是node_module依赖包的更改,这个方法并不可行。第二个方法比较安全而且快捷通过发布一个版本号不同的exe,如下:1.在这个创建安装程序的步骤2中,我们把程序代码都复制到了这个文件夹里面,如下图:
如果后续我们的程序要进行更新,首先我们需要把更改的文件直接复制替换到这个文件夹。
2.打开Package.nuspec,编辑version标签
3.参考本文种中创建安装程序部分的步骤2-4,重新生成setup.exe,发布应用。
通过执行setip.exe安装,程序会自动删除之前的应用,但是我并不清楚,sqruieel 是进行了增量替换,还是将之前的整个应用进行删除,再重新安装。
创建自定义安装包
在上一步,我们已经把自己的exe发布出来了,但是如果没有自定义名字跟icon,好像还不够酷,所以我们需要创建自定义的安装文件。
1.下载安装 Resource
Hacker
2.打开这个项目目录,在electron.exe上面右键
出现菜单,点击 Open using Rescource Hacker。
3.Resource Hacker应用运行之后中,在以下界面中选择Icon,然后在工具栏里面选择Action,Replace
Icon,如下图:
然后选择自己想要替换的.ico文件就好
4.这其实并不够,我们还需要更换exe里面的版本信息,打开Version
Info,把FileDescription和ProductName改成我们自己的项目名称,最好把SquirrelAwareVersion也更改一下,毕竟是版本号。
5.做完这些之后,我们需要按照之前的步骤,在命令行中输入
nuget pack Package.nuspec
重新生成nuget包,然后再使用
squirrel --releasify <my_app_name>.<version>.nupkg 命令创建安装文件。
6.打开之后生成的releases文件夹,参考本文种中创建安装程序部分的步骤2-4,对setup.exe进行自定义。
最后,一个可以自动更新又安装便捷,还有我们自己的酷酷的图标跟名字的应用就生成拉!
electro是什么意思(EMI是什么意思)
ESD指的是什么 ESD(Electro-Staticdischarge)的意思是“静电释放”。ESD是20世纪中期以来形成的以研究静电的产生、危害及静电防护等的学科。因此,国际上习惯将用于静电防护的器材统称为ESD,中文名称为静电阻抗器。静电是一种客观存在的自然现象,产生的方式多种,如接触、摩擦、电器间感应等。静电的特点...
electroluk空调遥控器怎么用
1、首先将空调插上电源,点击遥控器开关键将空调启动打开。2、然后点击模式键,选择制热或是制冷。3、通过点击“↑”“↓”键可以调节设定温度。4、点击风量键可以设置出风的大小,点击摇摆,可以设置摆风。5、点击定时键可以设置自动关机,electrolux空调遥控器的用法就介绍完了。
当今中外都流行什么样的音乐风格?
这种技术常在现场表演时,将歌曲重新混音(remix)呈现。像massive attack 的专辑protection便由mad professor从trip-hop音乐混音成了dub版本。 11.electro早在70年代末,80年代初,那时还没有house,techno...这类玩意儿,电子音乐也较不盛行,只有electro这类电子音乐而已. electro可说是纯粹以电子合成器(synthesizer,长得...
Electro Optics宽带光隔离器产品介绍,可定制
法拉第宽带光旋转器,法拉第光隔离器在出厂时已经过优化,以提供较佳的隔离和传输的有序偏振方向,工作温度和波长。EOT建议将光注入设备的输入侧以及客户小心地将旋转器与光束路径对齐以确保最佳性能。EURYS宽带光隔离器提供前向高透射率和反向720 nm至950 nm之间的强背反射光,保护钛蓝宝石振荡器免受背反...
什么是音乐中的合成音乐?
合成音,是说它的真正涵义是一个供不同设备进行信号传输的接口的名称,如今的MIDI音乐制作全都要靠这个接口,在这个接口之间传送的信息也就叫MIDI信息。合成音其实就是混音制作的 ,一般合成音指的是流行音乐的合成制作、混音制作一般指的是DJ舞曲混音合成制作。
electropop什么曲风?
Electropop是一种流行的电子流派,其音乐风格融合了流行音乐和电子音乐。下面将从音乐元素、特点和代表作三个方面来探讨Electropop曲风的特点。首先是音乐元素。Electropop的音乐元素非常多样化,其曲调通常较为简单,但节奏繁复。同时,Electropop的音乐中也常常使用合成器和电子乐器等电子设备,以此来创造富有...
想问问欧美音乐如何划分?
这种技术常在现场表演时,将歌曲重新混音(Remix)呈现。像Massive Attack 的专辑Protection便由Mad Professor从Trip-Hop音乐混音成了Dub版本。11.Electro早在70年代末,80年代初,那时还没有House,Techno...这类玩意儿,电子音乐也较不盛行,只有Electro这类电子音乐而已. Electro可说是纯粹以电子合成器(Synthesizer,长得有...
科学家开发柔性机器人ElectroSkin:可模仿蜗牛爬墙壁
通常来说此类机器人主要使用电粘力来实现,并依靠静电力挂载垂直表面上。ElectroSkin虽然也使用了相同的技术,不过科研团队首次将这项技术和自我运动相结合,通过人造肌肉来模仿蜗牛的膨胀和收缩可以往上爬。由于具有弹性,柔韧性,ElectroSkin可以卷起并塞入口袋中,在展开状态下可以扔到任意表面进行工作。在...
Electroiux空调遥控器显示64f
Electroiux空调遥控器显示64f f代表华氏温度,说明空调显示的是华氏度,将其调回摄氏温度就可以了。 使用注意: 1. 遥控器不能增加您空调上的功能。如果您的空调机上无风向功能,则遥控器的风向键无效。 2. 遥控器为低耗产品,正常情况下,电池寿命为 6 个月,若使用不当电池寿命缩短,更换...
这部动漫叫什么名字
いま、あなたの目には何が见えてますか?现在你的眼里能看见什么?24 Dear My Friends我亲爱的朋友EX(OVA) 御坂さんはいま注目の的ですから御坂学姐现在是焦点人物 长井龙雪 高岛大辅 图片中双马尾的是白井黑子(しらい くろご)Shirai Kuroko备注:动漫作品《魔法禁书目录》及其外传《科学超电磁炮》中人物声优...
潮仲蓉生: 第一步,配置 package.json 第二步,编译 build --win --ia32 builder 支持编译成多种格式等等功能
凭祥市18656004155: 用什么工具开发electron - ?
潮仲蓉生: VisualStudioCode用的是AtomShellatom/electron·GitHub,基于io.js和Chromium,自然DeveloperTools就是Chromium自带的那个喽.
凭祥市18656004155: 如何利用HTML开发桌面程序?有哪些简单的方法? ?
潮仲蓉生: 你说的应该是将HTML程序打包为桌面程序吧,这里介绍一种简单的方式,利用node.js的electron打包,下面我简单介绍一下实现过程,主要内容如下:这里为了更好的说...
凭祥市18656004155: electron怎样与操作系统的原生gui交互 - ?
潮仲蓉生: 时下流行的web app打包工具主要有两个,一个是国内开发者主导的nw.js,另一个是国外大厂支撑的electron.对比了nw.js以及electron之后还是选择了electron,原因主要有以下几点: 1、基于该工具已有广泛被使用的产品,如:atom、vs code等.
凭祥市18656004155: 如何用前端技术开发混合桌面应用软件 - ?
潮仲蓉生: 可以考虑试试electron,或者nwjs,这两个比较出名,可以试试
凭祥市18656004155: 我是学计算机科学与技术专业的,就是我想开发电脑软件和手机软件,要用什么软件来开发exe和APP? - ?
潮仲蓉生: 你可以学习原生开发,也不可以学习h5,然后学习electron,就可以开发app.
凭祥市18656004155: 框架开发需要用到什么软件? - ?
潮仲蓉生: 现在比较常用的是eclipse和myeclipse 常用框架有:struts1,struts2,hibernate,spring,ibatis,Lucene Struts1和2,主要处理的是视图层和控制层,也就是页面表单数据的处理和逻辑控制和交互等 hibernate和ibatis,都是处理实体与数据库之间的关系映射的 spring是管理bean的!Lucene是全文检索的框架!
凭祥市18656004155: windows7可以装macaca吗 - ?
潮仲蓉生: 1、Macaca由Node.js开发,所以需要安装Node.js.https://nodejs.org/en/2、安装Node.js完成. 首先切换切换淘宝源,因为国外资源访问很慢,而且有些资源还无法下载.> npm install -g cnpm --registry=https://registry.npm.taobao.org3、通过淘...
凭祥市18656004155: 如何使用ArcGIS Diagrammer设计空间数据库框架 - ?
潮仲蓉生: 1 打开软甲,新建一个新建一个Diagrammer,使用【File】下面的【New】菜单,新建一个Diagrammer. 2 新建一个Feature Dataset,并更名为道路信息: 多图 3 新建一个point对象,并命名为道路路线,建立一个network,并命名为...
凭祥市18656004155: delphi做插件框架软件开发,该怎么处理 - ?
潮仲蓉生: 一个终极框架是:解释性delphi 一个通用的解释器(客户端)自动从服务器下载 pas/dfm的加密包,在本地解压到内存里直接解释执行 pas/dfm可以通过delphi的免费版进行开发,测试完毕在自动分发(压缩加密)到服务器