React项目编译报Parsing error: require() of ES Module not supported如何解决

这个报错和你编写的业务代码没有任何关联，属于依赖包版本不兼容导致的ESLint解析错误。
已经废弃的babel-eslint包仅支持ESLint v7及更早版本，你当前项目安装的ESLint版本过高，其内部依赖的eslint-scope已经改为ES模块格式，babel-eslint仍然用CommonJS规范的require()语法引入该模块，就触发了该报错。

• 第一步：卸载已经停止维护的babel-eslint

# npm用户执行
npm uninstall babel-eslint
# yarn用户执行
yarn remove babel-eslint

• 第二步：安装官方维护的替代解析器@babel/eslint-parser

# npm用户执行
npm install @babel/eslint-parser --save-dev
# yarn用户执行
yarn add @babel/eslint-parser -D

• 第三步：修改项目根目录下的ESLint配置文件（支持.eslintrc、.eslintrc.js等格式），将parser字段的值替换为新的解析器：

{
  "parser": "@babel/eslint-parser"
}

如果你暂时不想修改ESLint配置，可以直接将ESLint版本降级到v7.x的最终稳定版：

# npm用户执行
npm install eslint@7.32.0 --save-dev
# yarn用户执行
yarn add eslint@7.32.0 -D

如果你使用create-react-app脚手架生成的项目未自定义ESLint配置，直接执行上述降级命令即可解决问题。

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