本文将简述如何将Electron应用打包为windows安装程序。

预先准备

  1. Node环境
  2. 安装wix (打包成msi安装程序的工具): https://wixtoolset.org/, 安装完成后,将wix的bin文件夹加入PATH环境变量。例如C:\Program Files (x86)\WiX Toolset v3.11\bin\。打开cmd,输入candle查看wix是否被加入到环境变量。
    image.png
  3. 安装electron-wix-msi(调用wix将electron应用打包为msi安装程序的工具):新建一个空的文件夹,并初始化npm环境:npm init,再输入npm i --save-dev electron-wix-msi
    image.png
    安装好之后在文件夹中新建一个名为pack.js的node脚本,内容为:
const {MSICreator} = require('electron-wix-msi');

async function main(){

  const msiCreator = new MSICreator({
    appDirectory: '',
    description: '描述', 
    exe: '',
    name: '',
    cultures: 'zh-cn',
    shortName: "test",
    manufacturer: 'test',
    version: '1.0.0',
    outputDirectory: '',
    ui: {
      chooseDirectory: true
    },
  });
  const supportBinaries = await msiCreator.create();
  await msiCreator.compile();
}
main().catch(err => {console.log(err)})

其中MSICreator构造器的参数请见electron-wix-msi的文档

开始打包

  1. 使用electron-packager将electron应用进行打包。在electron应用的目录下,使用指令(以64位系统为例,如果为32位系统,将--arch去掉即可)

    npx electron-packager ./ appname --platform=win32 --arch=x64 --asar 

    --asar参数是为了将node_modules/文件夹打包为一个文件,避免node_modules/中有过长的路径名导致打包失败,感兴趣可见参考资料

  2. 打包成功后,electron目录下应该有appname-win32-x64字样的文件夹,其中就包含有.exe程序,这个程序就是可以直接运行的。
  3. 打开之前写好的pack.js,复制appname-win32-x64绝对路径,然后将路径粘贴到appDirectory项。outputDirectory填写的是安装程序的绝对路径,例如要把安装程序放在桌面上C:\Users\ASUS\Desktop\installer。如果没有installer文件夹,脚本会自动创建。
  4. 运行node pack.js
    image.png

即可打包成功


CTi_
4 声望0 粉丝

Fell asleep when the light is on