配置ESLint的react-hooks/exhaustive-deps规则报meta.hasSuggestions错误如何解决

问题根源 #

1. 该报错由ESLint 8.x版本新增的规则约束触发：所有提供自动修改建议的规则，必须在规则自身的元信息中声明meta.hasSuggestions: true。你当前使用的eslint-plugin-react-hooks@4.2.0版本未适配ESLint 8的这项要求，因此开启react-hooks/exhaustive-deps规则后就会抛出错误，导致整体校验功能失效。
2. 你在.eslintrc.js顶层添加meta配置的操作不生效：meta是开发ESLint自定义规则时才需要配置的属性，不属于用户侧ESLint配置的合法字段，因此会报非法属性错误。

可用解决方案 #

两种方案二选一即可：

• 方案1（推荐）：升级eslint-plugin-react-hooks到适配ESLint 8的版本
  执行以下命令更新依赖：

  # 使用npm的场景
  npm install eslint-plugin-react-hooks@latest --save-dev
  # 使用yarn的场景
  yarn add eslint-plugin-react-hooks@latest --dev
  

  4.3.0及以上版本的eslint-plugin-react-hooks已经修复了该兼容问题，升级后原有ESLint配置无需改动即可正常运行。
• 方案2：降级ESLint到7.x版本
  如果暂时不想升级插件，也可以将ESLint版本回退到没有该项约束的7.x分支：

  # 使用npm的场景
  npm install eslint@7.x --save-dev
  # 使用yarn的场景
  yarn add eslint@7.x --dev
  

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