本篇文章介绍详解使用webpack+electron+reactJs开发windows桌面应用。 electron是一两年前挺火的一个框架 本质上是一个浏览器,但是集成了很多windows系统的功能,让前端开发也可以直接操作windows的窗体,做成一个实打实的桌面软件 (当然听说mac上也可以用
本篇文章介绍详解使用webpack+electron+reactJs开发windows桌面应用。 electron是一两年前挺火的一个框架 本质上是一个浏览器,但是集成了很多windows系统的功能,让前端开发也可以直接操作windows的窗体,做成一个实打实的桌面软件 (当然听说mac上也可以用electron,不过没试过) (没错我还在用windows,不是mac也不是linux,我是个lowB) 团队主要的技术栈是react,所以考虑用react开发,方便维护。 PS.由于项目是大半年前做的,所以一些细节可能记忆有误请见谅 几个重点:
main.js文件里会对窗体部分做很多配置
网页项目部分使用ipc模块与electron的窗体部分的ipcMain模块进行通信,网页项目部分可以发送以某个指令给窗体部分 网页项目部分发送指令
窗体部分接收到指令后做相应的行为
窗体部分也可以使用webContent模块与网页项目部分通信 比如用户点击关闭窗体,可以使用event.preventDefault();阻塞关闭,然后通知网页项目部分,做退出登录的行为,退登完成之后再关闭窗体
网页项目部分做对应的行为 比如退出登录,退出登录完成后,也使用ipc通知窗体部分,窗体接收到'logout-succ'后,执行关闭窗体的行为。
·在开发项目时,可以先用网页的形式开发项目,等到网页项目部分差不多完成后,再注入electron中,开发网页项目部分和窗体部分的交互 ·在webpack中使用target: "electron-main"后,webpack将不会打包有关eletron的代码 |
2021-06-04
2019-01-10
2019-02-17
2021-09-12
2021-09-30