react

1、create-react-app创建React项目：

• 1 ）https://create-react-app.dev/docs/getting-started/
  npx create-react-app demo --template typescript,可以创建支持Typescript类型的react项目；
• 2）react-app-rewired此工具可以在不 'eject' 也不创建额外 react-scripts 的情况下修改 create-react-app 内置的 webpack 配置，然后你将拥有 create-react-app 的一切特性，且可以根据你的需要去配置 webpack 的 plugins, loaders 等。
  例如：可以自定义webpack的打包配置

2、使用webpack自己搭建react项目：

一、babel

• 1）babel: https://babeljs.io/setup#installation,, 其他的一个文档中文
  + @babel/preset-env 包括ecmascript中的新特性，es6，es7....一些最新的js特性
  + @babel/preset-react:转换jsx语法
  + @babel/preset-typescript:Babel 可以删除类型注释

• 2） @babel/polyfill 模块包括 core-js 和一个自定义的 regenerator runtime 模块用于模拟完整的 ES2015+ 环境。

• 3）@babel/plugin-transform-runtime: https://zhuanlan.zhihu.com/p/147083132, 待测试可以先不用

yarn add @babel/plugin-transform-runtime -D

yarn add @babel/runtime-corejs3

二、webpack

1. webpack配置文件，css，图片，字体
   webpack配置Typescript
   webpack配置参考

三、typescript

) tsconfig.json:typescript 一个基本的配置文件，可以设置编译为es5

四、webpack 插件

1） html-webpack-plugin：

五、webpack 热更新：https://github.com/pmmmwh/react-refresh-webpack-plugin/ (后期可以考虑使用，暂时先没用)

demo

六、eslint

初始化

七、react-router

八、搭建步骤

babel
webpack
css
webpack配置
webpack babel
webpack dev prod
hmr
eslint
react-router redux
redux-thunk 异步 axios
history
withRouter