升级React版本后出现Babel报错Unknown option: .name问题求解

问题解决方案 #

• 优先检查所有Babel配置文件（包括.babelrc、babel.config.js、babel.config.json）是否在顶层配置了name字段，新版Babel Core已经移除了该配置项，直接删除该字段即可解决绝大多数该类报错。
• 检查Babel相关依赖的版本兼容性，升级React后很容易出现Babel相关依赖版本跨度太大的兼容问题，可按以下步骤处理：
  1. 删除项目根目录的node_modules文件夹，以及包管理工具的锁文件（package-lock.json/yarn.lock/pnpm-lock.yaml）
  2. 重新安装匹配版本的Babel依赖，参考命令：

  # 开发依赖
  npm install @babel/core @babel/preset-env @babel/preset-react @babel/runtime --save-dev
  # 生产依赖
  npm install @babel/runtime-corejs3 --save
  

• 如果你使用的是React Native环境（从报错路径可判断），还需要同步检查metro-react-native-babel-preset的版本是否和当前React Native版本匹配，升级该预设到对应版本即可。
• 如果以上方案都无效，可以逐个注释Babel配置中的插件项，排查是否是第三方Babel插件传入了非法的name配置参数，定位到异常插件后将其升级到最新稳定版即可。

内容的提问来源于stack exchange，提问作者User511