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. 使用Typora

    Markdown学习 标题:#+空格+名称 二级标题 二级标题:##+空格+名称 三级标题 几级标题以此类推,最多支持到六级标题 字体 Hello,world! 变粗体:一句话的前后加上两个** 变斜 ...

  2. 【每日一题】【dfs重载原始函数&循环/函数结束条件&左右下标在数组中位置的确定】2022年2月7日-NC12 由先序和中序遍历重建二叉树

    描述给定节点数为 n 的二叉树的前序遍历和中序遍历结果,请重建出该二叉树并返回它的头结点.例如输入前序遍历序列{1,2,4,7,3,5,6,8}和中序遍历序列{4,7,2,1,5,3,8,6},则重建 ...

  3. Logseq001笔记类--视频悬浮插件--Helium

    这是我准备新开的学习记录系列之一 今天写一个插件的介绍吧-- Helium -- 视频悬浮插件 youtube/b站/本地视频都可以导入 主要功能就是你在看视频时,要记一些学习笔记,随着不断往下写,视 ...

  4. MongoDB从入门到实战之MongoDB简介

    前言 相信很多同学对MongoDB这个非关系型数据库都应该挺熟悉的,在一些高性能.动态扩缩容.高可用.海量数据存储.数据价值较低.高扩展的业务场景下MongoDB可能是我们的首选,因为MongoDB通 ...

  5. md5-有道翻译

    网站 aHR0cHMlM0EvL2ZhbnlpLnlvdWRhby5jb20v 测试发现三个值是变化的 一.第一种方法 initiator一步一步找,在t.translate中找到以下内容 这里可以看 ...

  6. [深度学习] 基于切片辅助超推理库SAHI优化小目标识别

    对象检测是迄今为止计算机视觉中最重要的应用领域.然而,小物体的检测和大图像的推理仍然是实际使用中的主要问题,这是因为小目标物体有效特征少,覆盖范围少.小目标物体的定义通常有两种方式.一种是绝对尺度定义 ...

  7. 【集成开发环境 (IDE)】Dev-Cpp下载与安装 [ 图文教程 ]

    版权声明 本文作者:main工作室 本文链接:https://www.cnblogs.com/main-studio/p/17037280.html 版权声明:本文为 博客园 博主「main工作室」的 ...

  8. Hexo博客搭建记录

    Hexo博客搭建记录 参考视频:手把手教你从0开始搭建自己的个人博客 |无坑版视频教程 以下命令操作建议使用管理员权限完成 1. nodejs & hexo 安装 1.首先下载node.js, ...

  9. Linux c 程序自动启动自己

    在程序自动升级的时候需要自己重新启动自己 #include <stdio.h> #include <stdlib.h> #include <unistd.h> in ...

  10. 让你的手,不再抽筋,速度:修改mac的快捷键,以及鼠标滑动

    我是资深️windows系统爱好者️ 最近开始尝试使用MAC系统进行代码运行测试,从配置环境,到写博客,一天按下了n次的复制粘贴快捷键, 妈耶,感觉要抽筋了 呜呜--- 这简直无法忍,我决定修改这个快 ...