electron-react-app

整合react-app和electron的独立开发模式

• 环境要求
• 开发&打包
• 项目概要

环境要求

版本

node: v12.18.1
npm: 6.14.8
yarn: 1.22.4
electron-forge: 6.0.0-beta.54

全局依赖安装

• node
• yarn
• electron

开发相关

初始化

yarn binit

本地开发

yarn bstart

打包&&编译应用

yarn bmake

项目概要

electron初始化

yarn create electron-app electron-react-app

react初始化

yarn create react-app react-app --template typescript
cd react-app
yarn add antd
yarn start

更改react打包路径

默认生成目标路径为react-app/build，调整为src/view，(配置文件react-app/config/paths.js)

相关代码：

{
  appBuild: resolveApp('../src/view'),
}

启动浏览器替换成启动electron

通过修改react-app/scripts/start.js添加startElectron变量，决定否同步启动electron

相关代码：

require("child_process").spawn("yarn", ["startElectron"]);

系统引入其他支持

• 数据存储：使用electron-store进行数据持久化
• 志打印：使用electron-log打印日志
• 调试主线程: 可使用vscode调试主线程