Electron 介绍及环境搭建

Electron 简介

简单来说,Electron就是可以让你用Javascript、HTML、CSS来编写运行于Windows、macOS、Linux系统之上的跨平台的桌面应用的开源库。
Electron 需要如下的组件:

Electron 开发环境所需组件

1. NodeJS

简单来说,Node.js 是一个能让 JavaScript 运行在后端的运行环境,很适合用来通过
JavaScript 语言开发web服务端。

  • Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。
  • Node.js 使用了一个事件驱动非阻塞式 I/O 的模型,使其轻量又高效。
  • Node.js 的包管理器 NPM,是全球最大的开源库生态系统。

2. NPM

NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:

  • 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
  • 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
  • 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

3. Electron

4. Visual Studio Code (或其他 IDE)

Electron 开发环境搭建步骤

1. 安装 Node.js 和 NPM

NPM会在安装Node.js的时候被同时安装。
下载地址
安装完成后,用以下代码验证是否安装成功:(cmd 中即可)

node --version
v8.10.0
npm --version
5.6.0

如果不成功,可能是因为安装程序出了一些问题,没有把node.exe所在目录加入到PATH环境变量中,请手动加入即可。

2. 安装 CNPM

因为众所周知的原因,在中国 NPM 的官方服务器可能会无法访问,所以可以用淘宝发布的镜像 CNPM,基本上10分钟同步一次,地址
安装:

npm install -g cnpm --registry=https://registry.npm.taobao.org

同样检测CNPM是否安装成功:

cnpm -v

之后使用只需把** npm 命令全替换为 cnpm** 即可,其他没有区别。

3. 安装 Electron

npm install -g electron

cnpm install -g electron

同样检测安装是否成功:

electron --version
v1.4.13

4. 运行

进项目目录:

npm start

electron .

1.

1.

1.

推荐阅读更多精彩内容