Data: 2022-2-12 Author: zhangyunbin
基于Create React App搭建基础项目架构 Craco 修改默认配置项目
- React脚手架的react-scripts和Craco存在版本冲突，当前脚手架生成的react-scripts版本是5.0.0，不指定Craco版本安装的版本是6.4.3，会出现无法安装的情况，可以通过 --force(强制安装)，又或者通过 --legacy-peer-deps可以安装成功(https://blog.csdn.net/weixin_41876046/article/details/120952621)
tailwind 实现响应式
- 如果react-scripts版本是5以上，运行项目可能会出现第三方npm包报错的问题，项目中解决打方案是将react-scripts降级4版本
- tailwind没有热更新，目前的做法的是在执行脚本前增加TAILWIND_MODE=watch，监视改变
主进程中通过loadURL加载web资源到渲染进程，所以需要先执行start命令，再执行electron:start，又或者可以通过concurrently来控制先后执行，此处我们是先执行start，在执行electron:start来实现
Create React App脚手架已经集成了eslint的配置，项目中也增加部分rules实现统一，具体请看package.json文件
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
Launches the test runner in the interactive watch mode.
See the section about running tests for more information.
Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.
Your app is ready to be deployed!
See the section about deployment for more information.
Note: this is a one-way operation. Once you eject, you can't go back!
If you aren't satisfied with the build tool and configuration choices, you can eject at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except eject will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
You don't have to ever use eject. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
You can learn more in the Create React App documentation.
To learn React, check out the React documentation.
This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify