Electron[4] Electron最简单的打包实践

1 背景

前面三篇已经完成通过Electron搭建的最简单的HelloWorld应用了,虽然这个应用还没添加任何实质的功能,但是用来作为打包的案例,足矣。下面再分享下通过Electron-forge来将应用打包成安装包。

2 依赖

在Electron2 Electron使用准备里头,我们已经安装好了Electron-forge,不懂的请点击下面的连接跳转。

Electron2 Electron使用准备https://weilintao.blog.csdn.net/article/details/134227423?spm=1001.2014.3001.5502在开始打包之前,请再次检查package.json里头是否有如下命令:

javascript 复制代码
    "package": "electron-forge package",
    "make": "electron-forge make"

3 打包

3.1 预打包

控制台执行如下命令:

bash 复制代码
npm run package

命令执行日志:

bash 复制代码
PS C:\xysj\electron\my-electron-app> npm run package

> my-electron-app@1.0.0 package
> electron-forge package

✔ Checking your system
  ✔ Running generateAssets hook
  ✔ Running prePackage hook
✔ Packaging application
  ✔ Packaging for x64 on win32 [21s]
✔ Running postPackage hook

这个命令是模拟打包的,最终会在/out/目录下生成一个文件夹,里头有模拟生成的包应用,此时还不是安装包,但是通过这种方式可以看打包后的效果。 其中my-electron-app.exe就是应用入口文件,双击即可执行。

3.2 打安装包

bash 复制代码
npm run make

命令执行日志:

bash 复制代码
PS C:\xysj\electron\my-electron-app> npm run make   

> my-electron-app@1.0.0 make
> electron-forge make

✔ Checking your system
✔ Loading configuration
✔ Resolving make targets
  › Making for the following targets: squirrel
✔ Running package command
  ✔ Preparing to package application
  ✔ Running packaging hooks
    ✔ Running generateAssets hook
    ✔ Running prePackage hook
  ✔ Packaging application
    ✔ Packaging for x64 on win32 [21s]
  ✔ Running postPackage hook
✔ Running preMake hook
✔ Making distributables
  ✔ Making a squirrel distributable for win32/x64 [1m45s]
✔ Running postMake hook
  › Artifacts available at: C:\xysj\electron\my-electron-app\out\make

上面的操作最终会生成一个安装包:

ok。到此,经过四篇文章,快速的让大家了解了,使用Electron制作桌面应用的极简流程。后面开始详细介绍使用Electron来制作一个云盘。 以及Electron桌面应用的打包技术选型和对比。

相关推荐
葡萄城技术团队9 分钟前
接一个前端库:以前要啃几天文档,现在三步——活字格 V12.1 AI辅助开发上手
前端
愿得一猪蹄20 分钟前
浏览器开发者工具隐藏技巧,你可能只用了一成
前端
daols8827 分钟前
vue 甘特图组件 vxe-gantt 修改滚动条样式-让滚动条自动隐藏
javascript·vue.js·甘特图
高晶31 分钟前
ARM 嵌入式 Linux 内核编译与结构解析实战
前端·架构
PegasusYu36 分钟前
Node.js使用nedb轻量级数据库测试脚本
数据库·electron·node.js·脚本·测试·轻量级·nedb
今年下半年1 小时前
【前端】Vue2 项目 ECharts 统计图表组件封装与使用实践(附组件源码)
前端·javascript·echarts
冒险的豆子1 小时前
JS 原型链 通俗易懂 解释说明(类比 关系)
开发语言·javascript·原型模式
西索斯coding1 小时前
在 中接入 教程:p配置、m填写、扩展思考参数一篇就够(2)
java·前端·javascript·ai
代码猎人1 小时前
前端怎么优化项目基础架构
前端
__sjfzllv___1 小时前
在职前端Leader学习/转行 AI Agent -DAY78
前端