原帖地址:https://newsn.net/say/electron-builder-basic.html
苏南大叔在本篇文章中,将实践electron-builder的基本使用方法。在开始本篇文章中,大家可以先学习一下,以前用electron-builder打包electron+vue的demo的相关文章。本文的主角项目是electron的quick-start项目。
mac环境:https://newsn.net/say/electron-vue-demo-mac-builder.html
win环境:https://newsn.net/say/electron-vue-demo-win-builder.html
错误处理:https://newsn.net/say/electron-builder-error.html
全局安装electron-builder
我们需要知道,electron-builder和electron-packager基本类似,不过builder打包完成的是安装包,而packager打包完成的是可执行文件,packager里面有项目源码,builder里面则是编译后的。这可能是两者的最大差别。
另外,全局安装之后,在命令行中,electron-builder
有个别名叫做builder
,两者是同一个npm包。大家需要知晓。(当然,有的时候,这个builder并不生效,大家可以多试试electron-builder
这个更通用的命令
npm install electron-builder -g electron-builder --version
直接编辑项目文件夹下的package.json文件,添加electron builder编译所需要的属性
貌似json文件使用注释会导致一部分编译报错,所以只在文章中写明注释,放到文件中最好将注释删掉
"build": { "appId": "com.leon.HelloWorld02",//包名 "copyright":"LEON",//版权 "productName":"HelloWorld02",//项目名 "dmg":{ "background":"res/background.png",//背景图片路径 "window":{ //窗口左上角起始坐标 "x":100, "y":100, //窗口大小 "width":500, "height":300 } }, "win": { "icon": "res/icon.ico"//图标路径 } }
"scripts": { "pack": "electron-builder --dir", "dist": "electron-builder" },
可以用builder的version命令查看是否安装成功。
一键构建所有安装包
electron-builder -mwl electron-builder --platform=all electron-builder --win --x64
这几个命令都可以达到我们构建所有平台安装包的目的,任选其一即可。
下面是构建得到的dmg的安装包。
其实实际上打包过程没有那么简单,会各种超时(timeout),我的建议是挂代理吧
分平台构建安装包
如果仅仅为得到一个安装包,快速进行测试的话,其他的各种参数,我们都使用默认值。那么你就可以如下所示,进行快速构建。正常情况下,肯定是有一堆其它参数的,大家请注意。我们这里仅仅是个演示的作用。下面的命令都是任选其一,选一个,你看着顺眼的执行即可。
mac:
electron-builder -m electron-builder -o electron-builder --mac electron-builder --macos electron-builder --platform=mac electron-builder --platform=darwin
win:
electron-builder -w electron-builder --win electron-builder --windows electron-builder --platform=win electron-builder --platform=win32
linux:
electron-builder -l electron-builder --linux electron-builder --platform=linux
参数说明
--platform 这个参数是过期废弃的参数,不建议使用。同样,还有 --arch (取值是ia32/x64/all)也是一个过期参数。替代参数是 --x64 或者 --ia32 或者 --armv7l 。
当 --platform 或者 --arch 没有指定的时候,就会build当前系统的platform,当前系统的arch。也就是说,下面的命令在不同的系统下,命令是不一样的。(没有指定platform和arch)。
electron-builder
--help 提示命令
Build Commands: cli.js build Build [default] cli.js install-app-deps Install app deps cli.js node-gyp-rebuild Rebuild own native code cli.js create-self-signed-cert Create self-signed code signing cert for Windows apps cli.js start Run application in a development mode using electron-webpack Building: --mac, -m, -o, --macos Build for macOS, accepts target list (see https://goo.gl/5uHuzj). [array] --linux, -l Build for Linux, accepts target list (see https://goo.gl/4vwQad) [array] --win, -w, --windows Build for Windows, accepts target list (see https://goo.gl/jYsTEJ) [array] --x64 Build for x64 [boolean] --ia32 Build for ia32 [boolean] --armv7l Build for armv7l [boolean] --dir Build unpacked dir. Useful to test. [boolean] --extraMetadata, --em Deprecated. Use -c.extraMetadata. --prepackaged, --pd The path to prepackaged app (to pack in a distributable format) --projectDir, --project The path to project directory. Defaults to current working directory. --config, -c The path to an electron-builder config. Defaults to `electron-builder.yml` (or `json`, or `json5`), see https://goo.gl/YFRJOM Publishing: --publish, -p Publish artifacts (to GitHub Releases), see https://goo.gl/tSFycD [choices: "onTag", "onTagOrDraft", "always", "never", undefined] Deprecated: --draft Please set releaseType in the GitHub publish options instead [boolean] --prerelease Please set releaseType in the GitHub publish options instead [boolean] --platform The target platform (preferred to use --mac, --win or --linux) [choices: "mac", "win", "linux", "darwin", "win32", "all", undefined] --arch The target arch (preferred to use --x64 or --ia32) [choices: "ia32", "x64", "all", undefined] Other: --help Show help [boolean] --version Show version number [boolean] Examples: electron-builder -mwl build for macOS, Windows and Linux electron-builder --linux deb tar.xz build deb and tar.xz for Linux electron-builder --win --ia32 build for Windows ia32 electron-builder --em.foo=bar set package.json property `foo` to `bar` electron-builder configure unicode options for NSIS --config.nsis.unicode=false See https://electron.build for more documentation.