使用electron-builder对Electron项目进行打包

·  阅读 1309

1、首先我们需要先安装electron-builder打包工具

以管理员身份运行CMD,然后输入命令cnpm install electron-builder -g即可安装。输入electron-builder -v查看是否安装成功,如下图所示为已安装好了的效果:

2、使用命令进行打包

第一次打包,需要下载以下文件(

如果使用命令自己下载,可能会很慢,你懂得,所以你可以提前手动下载好这些文件,并将其提前放至到对应的文件夹中去,最后才去执行打包命令

):
winCodeSign:github.com/electron-us…
nsis:github.com/electron-us…
nsis-resources:github.com/electron-us…
可手动将其先下载下来,然后将其文件分别解压到如下目录:
winCodeSign:C:\Users\quber\AppData\Local\electron-builder\Cache\winCodeSign\winCodeSign-2.5.0
nsis:C:\Users\quber\AppData\Local\electron-builder\Cache\nsis\nsis-3.0.4.1
nsis-resources:C:\Users\quber\AppData\Local\electron-builder\Cache\nsis\nsis-resources-3.4.1

以管理员身份运行CMD,然后定位到项目文件夹,输入如下命令:
cnpm run build

注意,在运行上述命令前,需要在项目中的package.json中设置build属性节点配置,具体配置请查看如下package.json代码。
其中cnpm run build中的build为package.json中scripts属性下的build属性名称,具体请查看如下package.json代码。

{
  "name": "el_test2",
  "version": "1.0.1",
  "description": "Electron测试的第二个项目",
  "main": "./app/index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build":"electron-builder --win --x64"
  },
  "keywords": [
    "quber"
  ],
  "author": "Quber",
  "license": "ISC",
  "build": {
    "productName":"el_test2",
    "appId": "quber.el_test2",
    "copyright":"Quber©20200220",
    "directories": {
      "output": "app_file"
    }, 
    "nsis": {
      "oneClick": false,
      "allowElevation": true,
      "allowToChangeInstallationDirectory": true,
      "installerIcon": "./app/images/256x256.ico",
      "uninstallerIcon": "./app/images/256x256.ico",
      "installerHeaderIcon": "./app/images/256x256.ico",
      "createDesktopShortcut": true,
      "createStartMenuShortcut": true,
      "shortcutName": "el_test_shortcut"
    },
    "win": {
      "icon": "app/images/256x256.ico",
      "target": [
        {
          "target": "nsis",
          "arch": [
            "ia32"
          ]
        }
      ]
    }
  }
}
复制代码

关于build属性说明如下:

更多说明可参考官网:www.electron.build/configurati…

打包执行命令效果如下:

3、打包成品

我们可以看到,在项目文件夹中的app_file文件夹中,有el_test Setup 1.0.0.exe文件和win-unpacked文件夹。其中的el_test Setup 1.0.0.exe为安装包,win-unpacked为非安装包,可直接点击里面的可执行文件运行,如下图所示:

分类:
后端
标签:
分类:
后端
标签:
收藏成功!
已添加到「」, 点击更改