介绍

Electron React Boilerplate是Github上超过12k+star的可扩展跨平台应用程序开发框架，Electron 是基于HTML+CSS+Javascript等 Web 技术创建原生程序的框架，它已经帮我们搞定了最难搞的部分，而Electron React Boilerplate在其基础上进行了扩展，将React集成进去并构建成了模板。

文档和Github地址

• 文档：

https://electron-react-boilerplate.js.org/docs/installation

• Github

https://github.com/electron-react-boilerplate/electron-react-boilerplate

特点

• 热加载

顾名思义，实时预览功能

• 可扩展

构建没有类型的可扩展应用程序只能做到这一步。开发应用程序时出现类型错误。在编译时和运行时引发错误

• 性能：构建优化

开箱即用的webpack优化和压缩代码解决方案，这避免了与传统Electron 应用程序相关的性能瓶颈。

• 项目使用到的工具

Electron

React, Redux, React Router,

Webpack

React Hot Loader

快速入门

测试环境：Windows 10 V1903

# 从Github快速克隆:

 git clone --depth=1 https://github.com/electron-react-boilerplate/electron-react-boilerplate.git your-project-name

#命令行到项目目录

 cd your-project-name

# yarn安装依赖

 yarn

#运行

yarn dev

运行成功

我这里中途并未出现过什么错误，如果你在搭建过程中出现了什么错误，可以参考官网的安装调试指南。

#构建

yarn build

#打包

要打包本地平台的应用程序：

 yarn package

构建多个平台请参考官方指南，设计一些依赖

yarn package-all

构建可选平台 yarn package --[option]

yarn package --win //windows
yarn package --mac //mac
yarn package --linux //linux

编辑器配置

建议使用VSCode安装以下扩展，只为了让你有更好的体验，以及提高编码效率

• Editorconfig
• ESLint
• Prettier
• Flow
• Babel
• Jest
• ES6 Snippets
• React Snippets

项目目录

项目的目录和开发基本的React应用相差不大

总结

有了Electron React Boilerplate可以省去我们很多基础工作的时间，对于熟悉React的人来说尤为友好！