使用 Electron5.0 构建你的 React 项目

最近要使用 Electron 来构建 React 项目，突然发现之前的 Demo 已经不能正常运行了，有些感概技术发展的迅猛。

如果你还不了解 Electron，可以看我之前的文章：初探 Electron - 理论篇，理论知识没有变。如果你想了解 Electron5.0 版本如何构建 React 项目，不妨继续看本文。

需要注意：网上流传的 1.0 版本的项目应该已经启动不了了。

一、为什么要写此文

之前研究的时候，Electron 还是 1.0 版本，因此写了一系列的文章。

• 初探 Electron - 理论篇
• 初探 Electron - 升华篇
• 初探 Electron - 实践篇1
• 初探 Electron - 实践篇2

经过本次尝试，发现 5.0 版本有了更多的变化，所以不想误人子弟，索性更新此系列文章。

这次起手，我们就来构建一个 React 项目。

二、创建 React 项目

1.首先，全局安装 cli:

1	npm install --global create-react-app

2.创建项目

1	create-react-app electron5-react-demo

3.启动

1	cd electron5-react-demo && yarn start

4.访问 http://localhost:3000/ 如果看到如下页面，说明你的 React 项目已经成功启动了。

三、集成 Electron 环境

1.首先需要安装 Electron 和 Electron-builder

1	yarn add electron electron-builder --dev

2.增加相应开发工具

1 2	yarn add wait-on concurrently --dev yarn add cross-env electron-is-dev

3.项目根目录下新建文件：electron.js

1