dedecms Kotlin php file cocoa button view msbuild Keys.js angularjs教程 jquery获取dom对象 mysql默认密码 python与机器学习 python抛出异常 python中的if语句 python读文件 python编程工具 python读取本地文件 java读取文件数据 javasocket java的安装 linux基础教程 怎么安装linux 销售单打印软件 咪咕客户端下载 笔记本测试软件 掌门一对一下载 万能播放器电脑版 小米游戏鼠标 linux安卓模拟器 相册制作工具 cdlinux教程 jsp源码下载 renderpartial ipad怎么清理内存垃圾 excel后缀 凯立德下载 jdk9 cdr怎么导出图片 js绑定事件的方法
当前位置: 首页 > 学习教程  > 编程语言

Electron环境搭建打包桌面应用exe

2020/12/5 10:52:01 文章标签:

目录 一、安装node.js 二、安装淘宝镜像的包命令行管理工具cnpm 三、安装electron 四、安装打包工具electron-packager 五、使用electron-packager打包成exe 一、安装node.js 到http://nodejs.cn/download/下载安装最新版本的node.js。默认安装即可。 (npm是no…

目录

 

一、安装node.js

二、安装淘宝镜像的包命令行管理工具cnpm

三、安装electron

四、安装打包工具electron-packager

五、使用electron-packager打包成exe


一、安装node.js

到http://nodejs.cn/download/下载安装最新版本的node.js。默认安装即可。
(npm是node的模块管理工具,由node附带安装)

安装完成后,使用node -v检查nodejs是否安装成功:

二、安装淘宝镜像的包命令行管理工具cnpm

1.看一下npm仓库地址:

npm get registry

得到 https://registry.npmjs.org/
2.替换地址

npm config set registry http://registry.npm.taobao.org/

3.建议把npm的仓库切换到国内taobao仓库。因为可能的GFW问题(不然会下载很慢很慢,也可能下载失败)。执行下面的命令:

npm config set registry "https://registry.npm.taobao.org/"

4.安装cnpm:

npm install -g cnpm --registry=https://registry.npm.taobao.org

三、安装electron

npm install -g electron

查看electron是否安装成功可通过命令 electron -v 查看。

四、安装打包工具electron-packager

安装electron-packager工具:

npm install -g electron-packager

五、使用electron-packager打包成exe

注:电脑需安装git

git clone https://github.com/electron/electron-quick-start 

cd electron-quick-start 

npm install 

1.直接运行

npm start

2.使用electron-packager打包成exe

(1)最简打包

cd到electron-quick-start文件夹,执行如下最简单的命令,即可开始打包。

electron-packager .

打包成功后查看electron-quick-start-win32-x64文件夹中的输出文件:

点击其中的exe,即可启动桌面程序:

(2) 直接在命令中设置参数打包

执行命令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

效果基本同最简打包

在这里插入图片描述

(3) 在package.json文件中配置参数打包

命令较长,每次打包都需要输入很麻烦,可以把命令配置到package.json文件中scripts属性中:

"scripts": {
  "start": "electron .",
  "packager": "electron-packager . fukaiitapp --out fukaiitapp --arch=x64 --overwrite --ignore=node_modules"
},

然后便可运行命令cnpm run-script packager进行打包:


在这里插入图片描述
看效果与上面直接在命令中设置参数的方式相同,但经错误提示发现,使用这种方式时,package.json文件中的name属性不能含有中文和空格等特殊字符。

 


本文链接: http://www.dtmao.cc/news_show_450335.shtml

附件下载

相关教程

    暂无相关的数据...

共有条评论 网友评论

验证码: 看不清楚?