HTML5教程

解决electron打包慢,卡

本文主要是介绍解决electron打包慢,卡,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

前言

这两天搞了一个electron项目,代码2小时,打包1天。因此写个文章给打包困难的朋友。

1.安装electron-builder

npm install electron-builder --save-dev

2.更改npm的源和版本设置

这个设置可以在你执行安装依赖之前就设置好

//你可以使用终端输入命令
npm set ELECTRON\_MIRROR\=https://npm.taobao.org/mirrors/electron/

npm set ELECTRON\_CUSTOM\_DIR\=9.0.0

或者直接在C:\user\xxx路径下 搜索.npmrc然后打开文件进行修改
image.png
image.png

注意:这个版本号需要和你package.json中的版本号相同

3.增加package.json里的设置

"build": {
    "appId": "com.xxx.app",
    "mac": {
      "target": ["dmg","zip"]
    },
    "win": {
      "target": ["nsis","zip"]
    }
},
"scripts": {
    "dist": "electron-builder --win --x64"
},

这里默认是打windows 64位的包.
如果打其他平台的包,只需要更改dist对应的命令,大概怎么配置请百度builder的配置

4.执行打包

npm run dist

打包需要依赖于三个包,分别是

  1. electron-v版本-打包的平台.zip的包
  2. winCodeSign
  3. nsis

其中第一个因为我们已经配置了下载的源,所以按理说是百分比成功的,大概1分钟下载好,第二第三个是从GitHub拉的,国内网络的话很大可能会卡住。如果卡住的话我们可以手动下载相关的包,放置到指定目录即可。
image.png

  • 第一个包:从这里我们可以看到下载地址,如果下载失败的话,我们可以可以ctrl+click来点击这个链接,看看能否正常下载,如果不可以,那么我们可能要更改一下我们第2步的npm设置,因为第一步没有下载失败的情况,因此不作赘述
  • 第二个包:winCodeSign 如果无法下载,我们使用ctrl+click手动下载好安装包以后,解压到如下目录即可: C:\用户\xx\AppData\Local\electron-builder\Cache\winCodeSign
    image.png
  • 第三个包:nsis 如果无法下载,那我们从如下网站下载相应版本的包 https://github.com/electron-userland/electron-builder-binaries/releases
    image.png
    image.png
    下载好以后,重命名这两个文件夹(即加上版本的后缀),然后移动到对应目录
    image.png
    image.png

最后再跑一遍npm run dist命令,如果遇到报错!请一定要确认你的路径中没有中文,我就是吃了一个大亏!

5.过度疲劳之后

成果如下,点击exe即可执行
image.png

这篇关于解决electron打包慢,卡的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!