(一)electron安装及编译打包
一、安装及打包
1.安装node.js和npm(略)
2.安装electron-builder
1 | // yarn add electron-builder --save-dev |
3.添加脚本
package.json
1 | "scripts": { |
4.运行打包命令
自动从网上下载winCodeSign、nsis和nsis-resources文件到C:\Users\algz\AppData\Local\electron-builder\Cache 目录。(由于外网原因会下载失败,需手动下载文件,详细见“二、打包时的网络问题”)
1 | >npm run dist |
5.package.json 全部配置说明(可选)
1 | "scripts": { |
二、打包时的网络问题
在electron使用electron-builder打包过程中需要用到几个github上的包,但是由于网络原因,下载不下来,导致出错;
1. electron-v30.0.8-win32-x64.zip (配置国内源,可自动下载)
导致的原因:
An existing connection was forcibly closed by the remote host.
远程主机强制关闭了现有的连接。
A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond.
连接尝试失败,因为被连接方在一段时间后没有正确响应,或者建立的连接失败,因为连接的主机没有响应。
解决方法二种:
(1) 手动下载zip文件,放到相应目录中。(不解压)
[!NOTE]
macOS: ~/Library/Caches/electron
Linux: ~/.cache/electron
windows: c:/user/xxx/AppData/Local/electron/Cache
(2) 配置国内源
项目目录下新建.npmrc 文件,添加以下内容 (找国内镜像,npmmirror 中国镜像站。),执行打包命令自动下载。
1 | electron_mirror=https://npmmirror.com/mirrors/electron/ |
2. winCodeSign-2.6.0.7z (需手动下载)
配置国内源不会访问,需手动下载并解压到指定目录。
下载后解压放到对应的目录%LOCALAPPDATA%/electron-builder/Cache/winCodeSign/winCodeSign-2.6.0
3. nsis-3.0.4.2.7z (需手动下载)
配置国内源不会访问,需手动下载并解压到指定目录。
直接放到对应的目录里面 `%LOCALAPPDATA%/electron-builder/Cache/nsisnsis-3.0.4.2
4. nsis-resources-3.4.1.7z (需手动下载)
配置国内源不会访问,需手动下载并解压到指定目录。
直接放到对应的目录里面
1 | windows: %LOCALAPPDATA%/electron-builder/Cache/nsisnsis-resources-3.4.1 |
再次打包:
成功!!!
三、devDependencies与dependencies的区别
- dependencies 表示我们要在生产环境下使用该依赖,
- devDependencies 则表示我们仅在开发环境使用该依赖。
在打包时,一定要分清哪些包属于生产依赖,哪些属于开发依赖,尤其是在项目较大,依赖包较多的情况下。