quasar使用electron打包

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打包就行了！
这两种打包方式，肯定还有一些别的区别，在这里就不写出来了， 小伙伴们自己研究吧~~