在第 01 节中我们已经搭建好了 Electron 的开发环境，接下来就写一个 Electron 最简单的Hello World程序，这也是每个开发者学习的第一个程序。有的下伙伴说把 Electron 安装到项目中太麻烦了，可不可以安装到全局变量，那答案是肯定的。
全局安装 Electron
npm install -g electron
如果安装失败，你可以多安装两遍，也可以使用 cnpm 来进行安装。
新建 index.html 文件
新建一个文件夹，比如叫ElectronDemo01.
在项目的根目录中新建一个index.html文件，然后编写如下的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hello World</title>
</head>
<body>
Hello World
</body>
</html>
新建 main.js 文件
在根目录下新建一个main.js文件，这个就是 Electron 的主进程文件。代码如下：
var electron = require('electron'); // 引入 electron 模块
var app = electron.app; // 创建 electron 引用
var BrowserWindow = electron.BrowserWindow; // 控制窗口引用
var mainWindow = null; // 声明要打开的主窗口
app.on('ready', () => {
mainWindow = new BrowserWindow({width:500,height:500}); // 设置打开的窗口大小
mainWindow.loadFile('index.html'); // 加载 HTML 页面
// 监听关闭事件，把主窗口设置为 null
mainWindow.on('closed', () => {
mainWindow = null;
})
})
创建 package.json 文件
写完后直接使用npm init --yes（–yes 表示默认安装什么东西都是同意）来初始化package.json文件，文件生成后如下：
{
"name": "ElectronDemo1",
"version": "1.0.0",
"description": "",
"main": "main.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
讲到这里，可能有的小伙伴要问了，为什么要后生成 package.json 文件呢？假如我们先生成 package.json 文件，那么”main”里面的文件就是默认的 index.js 文件。如果我们的本地有一个 main.js 文件，后生成就会让 main.js 作为我们的 main。
接下来你就可以打开终端，在终端里输入electron .就可以打开窗口了。
本文内容就先到这里，希望小伙伴们可以练习一下，跟着写一个Hello World的程序出来吧。