“如果你可以建一个网站，就可以建一个桌面应用程序”

你是否曾受限于浏览器的沙盒限制，或者再操作网页应用时无法满足下列场景下的使用需求，譬如读写本地文件、调用更多系统资源等。

因此，你想自行开发一个可以跨平台的调动资源的程序，但是又担心要学习新的语言，时间来不及，开发预算不足。

面对上述困扰，相信许多前端小伙伴脑中就会反应出一个应用程序——Electron。Electron的官网上说：

Electron是一个使用JavaScript、HTML 和 CSS构建，支持 Web 技术的跨平台开发桌面应用程序( GUI )，其本身是基于 C++ 开发的，GUI 核心来自于 Chrome，而 JavaScript 引擎使用 V8。

01

Electron诞生

回顾这项技术的诞生历程，堪称有趣。

时间回到2011年，一个叫王文睿的程序员与同事在讨论如何为Tizen WebRuntime增加扩展API的时候，创建了Node-Webkit项目，并打算用Node.js来操作WebKit。幸运的是，这样的尝试得到了单位的大力支持，当时王文睿就职的公司内部有个鼓励创新计划，这不仅给王文睿足够的时间，同时还分配了招聘名额，让他找到协助完善这个项目的同行人。

彼时，另外一位年轻人赵成进入了这个团队，并在实习的半年多时间里开发了跨平台的UI库功能，以及对Node-Webkit进行了一系列的修改与完善。

后来，赵成离开了，但是探索的脚步并未停止。之后，赵成帮助github团队尝试把Node-Webki应用到Atom编辑器上。不过因项目稳定性等原因，最终这个尝试以失败告终。直至2013年，GitHub与赵成启动了一个类似Node-Webkit的项目：Atom Shell。不久后，基于Atom 的框架，Electron被开发出来。2014年，这两个项目正式开源。（此处背景源自网络公开资料）

时至今日，Electron被Atom编辑器和许多其他应用程序使用，并且兼容Mac、Windows 和 Linux，可以构建出三个平台的应用程序。其中，这两年爆火的飞书就是基于这个技术开发而来，另外，VS Code、Slack等应用也是基于这个技术开发。

02

推荐一个GVP项目

初步了解这项技术的魅力及应用历程之后，今天，勤奋好学的马建仓就给大家推荐一款以Electron为核心的入门简单、功能丰富的 js 跨平台桌面软件开发框架——electron-egg。

项目概述

• 项目简介：

1. 这是一套代码，可以打包成Windows版、Mac版、Linux版或者以web网站运行，你只需要学习js语言即可，不过也同时支持Vue、React、EJS等前端技术。

2. 从理论上来说，electron-egg支持任何前端技术，能够编写出精美的UI效果。

3. 同时，该项目也可以用服务端的开发思维，来编写桌面软件，更重要的是还能同时启动多个工作进程。

• 开源许可证：Apache-2.0
• 项目作者：哆啦好梦
• 项目地址：electron-egg: 一个入门简单、功能丰富的 js 跨平台桌面软件开发框架。
  

操作准备

正式操作之前，你需要了解以下三个知识

• 进程：框架有三种进程，即electron主进程、electron渲染进程及egg服务进程。
• 业务调用，需要了解从前端-> egg业务、前端->electron业务等，并自由组合使用
• 掌握的开发语言：javascript、Node.js

使用流程

向上滑动阅览

1.选择开发模式：打开配置文件：electron-egg/electron/config.js。

2. 启动：

(1) vue模式【默认】；

(2) react模式，同vue；

(3) ejs模式，模板渲染

3. 编写一个api，供前端使用。

4. 如果是ejs模板渲染方式，编写一个hello页面。

5. 打包成exe、dmg、deb可执行文件。

场景演示