Electron创建应用以及打包exe
2020-11-26 本文已影响0人
李大鱼_
一、Electron官网文档,根据文档步骤创建应用
http://www.electronjs.org/docs/tutorial/quick-start#application-architecture
执行npm i --save-dev electron
可能会报错,如图:
可以给electron设置淘宝镜像,
添加.npmrc文件,内容ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron/
。如图:
再执行
npm i --save-dev electron
就不会报错了。
创建应用之后执行npm start
就可以在本地运行应用。
二、使用electron-packager打包成exe
全局安装打包神器electron-packager
npm install electron-packager -g
在命令中设置参数打包
执行命令electron-packager --help
或者访问官网查看所有可配置参数。
基本命令:
electron-packager <sourcedir> <appname> --platform=<platform> --arch=<arch> [optional flags...]
命令说明:
- sourcedir:项目源文件所在路径(唯一的必须参数)
- appname:项目名称(直接使用package.json文件中的name属性更方便)
- platform:要构建哪个平台的应用(Windows、Mac 还是 Linux)
- arch:决定了使用 x86 (ia32)还是 x64(x64),还是两个架构都用
- optional options:可选选项
一个命令举例:
electron-packager . fukaiitapp --out fukaiitapp --arch=x64 --overwrite --ignore=node_modules
说明:
electron-packager . 应用名称 --out 输出文件夹 --arch=x64 --overwrite --ignore=node_modules
在package.json文件中配置参数打包
命令较长,每次打包都需要输入很麻烦,可以把命令配置到package.json文件中scripts属性中:
"scripts": {
"start": "electron .",
"package":"electron-packager . test1 --platform=win32 --arch=x64 --icon=computer.ico --out=./out --asar --app-version=0.0.1 --overwrite --ignore=node_modules"
},
然后便可运行命令npm run packager
进行打包:
打包成功,生成out文件夹找到test1.exe,点击即可运行应用
image.pngimage.png