背景

我是用的是vue-cli-plugin-electron-builder提供的集成方式

此插件提供的打包插件是electron-builder

预知项

1.在什么系统上默认打什么系统的包 2.mac上可以打全平台的包 3.win/linux不可以打mac的包 4.不建议在mac上打windows的包,nsis在electron的打包下存在bug,打的包无法卸载

打包介绍

默认提供的打包命令

"electron:build": "vue-cli-service electron:build",

FAQ

mac如何打windows的exe文件

第一个--不要删,是npm传值的意思

npm run electron:build -- --win nsis

linux下如何打windows的包

这个比较复杂了,建议是用docker,具体见官网

我这里也提供两种思路

1.linux上创建一个windows镜像，在镜像内打包

2.使用官方docker插件打包，不过可能是我的使用方法不对，这个docker镜像创建的容器只能使用一次，使用第二次就会报错，所以我还是加了rm

docker run --rm -dit -v ${PWD}:/project -v /root/assistant-need:/root/.cache/  electronuserland/builder:wine npm run electron:win:dev

打包需要下载的几个必须包可以提前下载好，通过挂载的方式映射到docker容器内，避免每次下载浪费时间。

npm run electron:win:dev是我自己写的打包命令

如何使用vue的mode模式

直接使用

"electron:build:dev": "vue-cli-service electron:build --mode dev",

打包参数去哪配

官方文档:参数内容

#vue.config.js
module.exports = {
  pluginOptions: {
    electronBuilder: {
      preload: './src/preload.js',
      // 打包参数
      builderOptions: {
        appId: 'com.xxxx.xxx',
        productName: '项目名称',
        win: {
          target: [
            {
              target: 'nsis', // 我们要的目标安装包
            },
          ],
        },
      },
    },
  },
}

无星的electron之旅（四）——打包

背景

预知项