React项目升级
一、前端框架（或者库）升级的原因：
a、前端技术更新比较快，需要不断更新保持技术和依赖都和社区同步；
b、新版脚手架对性能和开发体验都进行了很多优化，新版脚手架基于社区2021年的相对最优解决方案和依赖。如vite2.0、react17（相比react16版本有了核心实现的重构）等；
二、详细描述要升级的框架以及类库。从哪个版本到哪个版本。有什么要注意的等等
a、antd 不做大版本升级；
b、react-script 3.0.1 → 4.0.3 脚手架的版本，无法向后兼容；(antd不做升级，对应的webpack5用不了，只能用webpack4.x的版本，所以对应的react-script只能升级到4.0.3，webpeck版本为4.44.2)
c、copy-webpack-plugin 调用方法有更改，无法向后兼容；
d、node less-loader less node-sass 的版本需要特别处理，需要在升级过程中调整相应的兼用版本；
三、升级的具体步骤
在项目目录下运行:
安装ncu
npm i -g npm-check-updates
ncu -u
rm -rf node_modules
npm i
有以下一些包要更新：
注意：
antd，less，less-loader不能升级到最新的版本，因为项目对antd做了很多定制化开发，andt升级改动较大，antd对less-loader的版本有依赖；
"less": "^3.10.3",
"less-loader": "^5.0.0",
"antd": "^3.26.19",
根据各依赖包版本升级之间的log，分析受影响的代码模块，开发自测；
使用 webpack-bundle-analyzer 插件分析build后的各个文件的大小，及时优化太大的js文件；
四、升级后的验证步骤有几步（保证升级后不破坏现有功能）
a、页面部署好之后能否正常打开；
b、页面有无报错信息，以及报错信息的类型;
c、冒烟测试是否能通过;
d、各功能模块流程是否能正常走通；
e、切记不要漏掉 WPA(web performance audit)；
五、接下来分享升级过程的具体报错及解决方案。
- ./src/index.sass (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-6-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--5-oneOf-6-3!./node_modules/sass-loader/dist/cjs.js??ref--5-oneOf-6-4!./src/index.sass)
Node Sass version 7.0.1 is incompatible with ^4.0.0 || ^5.0.0 || ^6.0.0.
此错误来自sass-loader不匹配。
可参考node-sass中的版本对应关系。
2../node_modules/antd/es/icon/style/index.less (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-8-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--5-oneOf-8-3!./node_modules/less-loader/dist/cjs.js??ref--5-oneOf-8-4!./node_modules/antd/es/icon/style/index.less)
TypeError: this.getOptions is not a function
原因： less-loader安装的版本过高
解决方案：
npm uninstall less-loader
"less": "^3.10.3",
"less-loader": "^5.0.0",
yarn
