起因

换了台m1的macbook, 我之前的看板electron程序构建的还是老的x64版本，使用上还需要使用rosetta2进行转译，性能损失不说，说不定还有潜在的问题，所幸看到 electron11开始支持使用arm64芯片的mac了，正好升级一波

写在前面

目前工具库还在preview，taobao镜像不可用

顺带提一下我之前的项目结构

• 基于 @vue/cli4

• 使用 vue-cli-plugin-electron-builder注入的electron相关

• 构建流 本地正常构建，自动构建流基于samuelmeuli/action-electron-builder@v1自动构建

• 项目地址点击这里

开工

升级依赖

首先需要升级使用的electron到支持新芯片的版本，目前能够使用的是electron11

npm install --save electron@11

同时我们需要升级electron-builder到支持打包新芯片的版本, 根据最新的方案，arch需要支持arm64并且可以打包dmg的话，需要升级到22.10.4

npm install --save-dev electron-builder@22.10.4

不过因为还在preview 只有npm官方仓库可以安装

接下来我们改造构建选项，因为我使用vue的插件, 所以我写在vue.config.js

module.exports = {

pluginOptions: {

electronBuilder: {

builderOptions: {

artifactName: '${productName}-${version}-${os}-${arch}.${ext}',

mac: {

target: {

arch: 'universal',

target: 'dmg'

}

}

},

}

}

}

这样可以打包一个自适应芯片的版本，当然你想打两个包可以把arch换成arch: ['x64', 'arm64']

没有使用vue插件的，直接在package.json里增加

{

"build": {

"mac": {

"target": {

"arch": "universal",

"target": "dmg"

}

}

}

}

最终

成功打出dmg，正常使用中

当然universal模式的大了100多m尽量还是按需打包把