quasar使用electron打包

 从构建好的项目中,我们不难发现,electron打包有两种方式:

electron-packager打包

 这篇博客是通过我尝试了很多种方法之后,最先开始,我使用的是electron-packager,所用的electron和electron-packager版本分别是:

"electron": "^18.0.2",

"electron-packager": "^15.4.0",

它打包时需要下载的包是:electron-v18.3.2-win32-x64.zip

尝试了很久,最后还是没搞明白怎么使用本地缓存来实现打包,

在这个文件夹下:C:\Users\xyongz\AppData\Local\electron\Cache

但是只要有这么一个文件:



文件内有如下两个文件:



我改了名字后,打包就不会成功了,只要修改了上面文件中的任意一个字母,就会报下面的错误

报错如下



不改文件名称就能正常打包,但怎么生成的这个文件,目前还没搞明白,如果有某位大佬知道,还请一定要在评论区多多交流~

使用electron-builder打包

我使用的是:"electron": "^19.0.2",

 首先我们需要修改我们的quasar.config.js文件:

官网位置:Publishing (electron-builder only)

// quasar.config.js

electron: {
bundler: 'builder', // set here instead of using command line flag --bundler
builder: {
appId: 'com.electron.myelectronapp',
win: {
target: 'nsis'
},
publish: {
'provider': 's3',
'bucket': 'myS3bucket'
}
}

运行quasar build -m electron命令后package.json文件中会自动添加"electron-builder": "^22.4.0",

此时程序继续运行,运行后报如下错误:



从报错中,我们可以看到,需要下载electron-v19.0.3-win32-x64.zip,此时,我们可以去淘宝镜像网站下载electron



把我们自己下号的zip放到:C:\User\xyongz\AppData\Local\electron\Cache



然后继续运行,发现还需要下载:winCodeSign-2.6.0.7z ,[点击下载](https://registry.npmmirror.com/binary.html?path=electron-builder-binaries/)



(下载好之后,可能还要下载一两个压缩包,但是,他们比较小,一般应该能下好)

下载好之后放C:\Users\xyongz\AppData\Local\electron-builder\Cache

需要新建文件夹,名字就是:winCodeSign,将下载好的压缩包解压到winCodeSign文件夹中,如图所示:



然后继续运行,接下来就可能出现如下错误:



没错,就是中文乱码,解决它,有一个简单的方法,就是把路径中涉及到的中文全改成英文,

如果不想这么做,那么我们就执行第二个方法:

找到 node_module/app-builder-lib/out/targets/nsis/NsisTarget.js中的executeMakensis() 方法,在这里面添加一句代码,支持中文

args.push("-INPUTCHARSET","UTF8");

如图所示:



运行结果图:



最后,

electron-packager和electron-builder打包的区别是:

electron-packager打包之后生成的目录如下:

electron-builder打包之后生成的目录如下:

从这两张图可以看出,用builder打包的方式,多了一个安装文件,如果想直接发送安装文件给朋友玩的话,就建议直接用builder打包,不需要安装程序就用packager打包就行了!

这两种打包方式,肯定还有一些别的区别,在这里就不写出来了, 小伙伴们自己研究吧~~

quasar使用electron打包的更多相关文章

  1. Electron 打包时下载 xxx-electron-v1.6.8--x64.zip 文件出错

    Electron 打包时下载 xxx-electron-v1.6.8--x64.zip 文件出错 今天在windows上打包其它平台的Electron应用的时候,由于是第一次,所以总是下载 xxx-e ...

  2. electron打包发布

    1.全局安装electron npm install electron -g 在cmd 直接输入 electron 直接启electron 2.编写第一个Electron应用 在任何地方,建立一个ap ...

  3. 记一次使用Node.js electron打包网站的记录

    具体步骤请参考:http://blog.csdn.net/a727911438/article/details/70834467 打包时出现了不少问题,逐一记录下来以供其他人参考. package.j ...

  4. Electron 打包Mac安装包代码签名问题解决方案Could not get code signature for running application

    最近一直在做electron应用的打包,集成mac版本的自动更新时出现了问题. Error: Could not get code signature for running application ...

  5. electron打包vue项目

    electron是什么 Electron是由Github开发,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Electron通过将Chromium和Node.js合并 ...

  6. electron打包之真的恶心

    用electron-packager进行打包 这个模块的文档写的真的垃圾 1.先看看首页的参数介绍 就是说必选参数就是源码路径和app名字和--platform还有--arch咯,而且源码路径也没说是 ...

  7. electron打包成桌面应用程序的详细介绍

    1.前提条件 a. 安装了node b.安装了electron c.你知道自己写的东西(js,css,html等等)放在那个文件夹(假设这个文件夹命名为 app,下面会用到)中 2.安装electro ...

  8. electron打包整理

    最近在折腾把项目打包成桌面应用程序,发现一个工具electron,可以讲项目打包成一个跨平台的应用程序,很方便,来学习一下. 1.先安装electron.electron-packager,安装方法可 ...

  9. electron打包分发

    原始的方式打包 下载对应的版本号的Release Electron 然后把对应的项目方便整理成这样的目录结构(Windows下) node_modules重新安装,不然可能启动失败 把整文件夹给别人就 ...

  10. 将现有vue项目基于electron打包成桌面应用程序

    一.前言 项目本来打算采用B/S架构去做的,浏览器网址方式打开还是让用户不方便: 二.使用electron集成桌面应用 本身项目是使用vue-cli开发的,在使用electron之前,需要将本身的项目 ...

随机推荐

  1. day09 常用工具类&包装类&集合——List、Set

    day09 常用工具类 java.lang.Math数值运算 基本数值运算,如初等函数.对数.平方根和三角函数 //最大最小值 Math.max(12, 21); Math.min(2, 3); // ...

  2. Type Script 在流程设计器的落地实践

    流程设计器项目介绍 从事过BPM行业的大佬必然对流程建模工具非常熟悉,做为WFMC三大体系结构模型中的核心模块,它是工作流的能力模型,其他模块都围绕工作流定义来构建. 成熟的建模工具通过可视化的操作界 ...

  3. day31-JQuery04

    JQuery04 6.jQuery的DOM操作02 6.9常用遍历节点方法 取得匹配元素的所有子元素组成的集合:children(),该方法只考虑子元素而不考虑任何后代元素 取得匹配元素后面的同辈元素 ...

  4. JavaEE Day09 JavaScript基础

    之前学了html.css两种静态资源 JavaScript是另一种静态资源,今日内容[重点]:JavaScript(是一门编程语言,2days)基础 一.JavaScript简介 1.概念 JavaS ...

  5. 【CDH数仓】Day02:业务数仓搭建、Kerberos安全认证+Sentry权限管理、集群性能测试及资源管理、邮件报警、数据备份、节点添加删除、CDH的卸载

    五.业务数仓搭建 1.业务数据生成 建库建表gmall 需求:生成日期2019年2月10日数据.订单1000个.用户200个.商品sku300个.删除原始数据. CALL init_data('201 ...

  6. MyBatis详解(二)

    前言 本篇幅是继 MyBatis详解(一)的下半部分. MyBatis执行Sql的流程分析 [1]基于前面已经将XML文件进行build解析了并且返回了SqlSessionFactory [1.1]那 ...

  7. JS传值与应用

    问题提出:在进行页面书写的时候,有时候需要进行动态页面拼接,在动态拼接的时候,涉及到函数的调用,函数的传值可能是HTML标签,或者含有json的标签,这样在传值时就有可能出现问题,由于"&q ...

  8. Netty-BIO、NIO、AIO、零拷贝-2

    Java BIO 编程 一.I/O 模型 1.I/O 模型简单的理解:就是用什么样的通道进行数据的发送和接收,很大程度上决定了程序通信的性能 2.Java 共支持 3 种网络编程模型/IO 模式:BI ...

  9. Unix 系统数据文件那些事儿

    前言 Unix like 系统和 windows 的最大区别就是有一套标准的系统信息数据文件,一般存放在 /etc/ 目录下,并且提供了一组近似的接口访问和查询信息,这些基础设施让系统管理看起来井井有 ...

  10. Lombok中@Builder和@SuperBuilder注解的用法

    @Builder 是 lombok 中的注解.可以使用builder()构造的Person.PersonBuilder对象进行链式调用,给所有属性依次赋值. Person person1 = Pers ...