electron整合react入门（踩坑）记录（2）

1. 前言

     在electron入门（踩坑）记录（1）(https://blog.csdn.net/qq_15241071/article/details/85049159）中，才刚刚运行出来electron官方demo，没高兴几秒，然后在简书electron+react教程中（https://www.jianshu.com/p/ea0852003209），用create-react-app生成的项目里面安装electron，em...凉了，开始报错。我用的命令是npm install electron --save --dev

然后懵逼了不知道怎么办，不管了先执行npm install electron试试，我靠没报错下载成功了，然后我勇(作）敢(死)又去执行了一次npm install electron --save --dev嗯也成功了。所以报错的时候当作是幻觉吧，多执行几次试试...

2. 启动

    经历这一波小插曲之后，终于看到package.json里面有了electron，我泪目了你们呢 

然后在package.json里面设置electron启动命令

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "electron-start": "electron ."
  }

接着在项目根目录下新建main.js，在package.json把main.js设置成入口文件

"name": "electron-react",
  "version": "0.1.0",
  "private": true,
  "main": "main.js",  //这里
  ...

然后main.js里面把 https://github.com/electron/electron-quick-start/blob/master/main.js，也就是electron官方入门demo的main.js拷贝进去。

然后在项目目录下面执行（并祈祷）npm run electron-start 

这次我运气不错

不过这只是在react项目里面启动了electron，还没有整合把它们整合到一起。

PS: 这一系列文章会记录根据简书这篇文章入手electron+react的过程，为什么人家都写了教程了我还要写呢，因为他只写了天选之子一路顺到底完成项目的过程，而没有写我这种衰人一路踩坑的经过呀。

另外，csdn博客上传图片有时候按上传按钮一步一步传不上去，其实可以直接拖图片进来的鸭。