前言

最近由于工作需要，公司的某块业务需求开发一款Windows桌面应用程序，无奈开发团队小伙伴们只有后台和H5童鞋，所以想从Web方向下手寻找解决方案。

想到之前VSCode发布时，了解过VSCode是基于WEB开发的桌面应用，便去了解了下VSCode的底层实现，于是，惊奇的发现了这个新大陆，一款强大又神奇的开源ElectronJS框架。

因而趁着五一假期时间，去研究了一下ElectronJs。

介绍

Electron的官网：

https://www.electronjs.org/

首先，Electron 基于 Chromium 和 Node.js ，是一个使用JavaScript，Html，CSS构建跨平台桌面应用的Webkit框架，它能够像浏览器一样解析、渲染Web页面。

因此，只要我们能够构建一个网站，就能使用Electron构建一个桌面应用。

其次，使用Electron 能够构建出兼容 Mac、Windows 和 Linux 的跨平台桌面应用，使得一份代码，处处运行，大大减少了开发成本，提高了开发效率。

最后， Electron 是一个Github开源框架，它有着活跃的社区和丰富的开发文档，使我们能够快速入门，在短时间内构建出可以使用的桌面应用。

Electron Github地址：

https://github.com/electron

使用

当前Electron发布的最新稳定版本为v8.2.5，以下内容均基于该版本。

• 环境配置

由于Electron项目由npm管理，所以，首先需安装nodejs，推荐使用最新稳定版，并配置相关环境变量。

访问Node.js下载页面(
https://nodejs.org/en/download/)，选择Windows Installer。 下载完成后， 执行安装程序，根据引导完成安装即可。

在安装过程中的配置界面, 请勾选Node.js runtime、npm package manager和Add to PATH这三个选项。

安装完成后，按下方步骤确认nodejs是否安装成功。

# 打印出Node.js的版本信息

node -v

# 打印出npm的版本信息

npm -v

npm i -D electron@latest

# 克隆示例项目的仓库

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

# 进入这个仓库

$ cd electron-quick-start

# 安装依赖并运行

$ npm install && npm start

npm install electron-packager --save-dev

应用

国内外使用Electron框架构建的桌面应用程序截止目前为止已达近千款，随着Electron的不断发展壮大，该数字还在持续增长中，目前最常用的应用程序主要有VSCode 、 Atom等。

更多Electron应用请详见：
https://www.electronjs.org/apps