之前有朋友找我开发一个基于H5-Dooring的桌面端应用。最近刚好有空，用了半天的时间，用electron从头开发了桌面端离线软件Dooring-。电子。因为之前很少用electron，今天刚学，基本把前后端都打通了。文末放上dooring-electron的github地址，供大家参考学习。如果你有更好的解决方案，可以随时联系我讨论.dooring-electron架构介绍熟悉Electron的朋友可能知道Electron继承了Chromium的多进程架构，这使得Electron非常类似于现代的网络浏览器在建筑学中。我们可以控制两种类型的进程：主进程和渲染器。每个Electron应用程序都有一个主进程，作为应用程序的入口点。主进程运行在Node环境中，我们可以使用Node的所有能力。那么我们在主进程中可以做什么呢？主进程的主要目的是使用BrowserWindow模块创建和管理应用程序窗口。BrowserWindow类的每个实例都会创建一个应用程序窗口并在单独的呈现器进程中加载??网页。我们可以使用窗口的webContent对象与主进程中的Web内容进行交互。有了上面的基础，我画了一个简单的dooring-electron架构图，方便大家理解：如果你对electron有更直观的理解，也可以参考它的官网：https://www.electronjs.org/dooring-electron我使用的技术栈是：koa2+electron+react+umi3接下来给大家介绍一下如何学习使用dooring-electron。Dooring-electron的安装与使用在安装之前，我们先来体验一下。(编辑器界面)(预览界面)(ide界面)安装下载代码gitclonegit@github.com:MrXujiang/dooring-electron-lowcode.git安装依赖包yarninstallorcnpminstalllocalstart本地启动应用yarndebug:mainprojectpackandbuildtestpackagenpmrunpack//只输出包，方便测试构建安装包1.执行前端资源打包npmrunbuild//react资源打包2.运行electronbuild命令输出安装包npmrundist-mac//macpackagenpmrundist-win//windowspackagenpmrundist-linux//linuxpackagenpmrundist-all//所有平台包的配置规则可以参考官方文档：https://www.electron.build/configuration/configuration安装案例作者使用打包输出dist-mac为例演示如何在mac上安装。首先我们找到package的release目录后，拖放到applications中：window和linux版本的安装也很简单，大家可以自己试试。如何快速学习electron下面我就来说说如何快速上手使用electron。最好有以下知识库：html+js+css基础知识熟悉nodejs的基本api有了以上基础，我们学习electron会很快。对于electron本身，我们只需要在其官网学习api介绍（按需学习）和demo即可。本文转载自微信公众号“趣话前端”，可通过以下二维码关注。转载本文请联系前端公众号。
