typescript - Eslint 未捕获 React-hooks/exhaustive-deps 违规行为

Question

我试图收到有关 React hooks 中缺少依赖项的警告，但没有收到警告。例如，在下面的示例中，我希望 eslint 通知我以下 useEffect Hook 缺少 state2 和 state3 的依赖项。

useEffect(() => {
    console.log(state2)
    console.log(state3)
}, [state1])

这是我的 .eslintrc.js 文件:

module.exports = {
  'env': {
    'browser': true,
    'es2021': true,
  },
  'extends': [
    'plugin:testing-library/react',
    'google',
    "prettier",
  ],
  'parser': '@typescript-eslint/parser',
  'parserOptions': {
    'ecmaFeatures': {
      'jsx': true,
    },
    'ecmaVersion': 'latest',
    'sourceType': 'module',
  },
  'plugins': [
    'react',
    '@typescript-eslint',
  ],
  'rules': {
    "require-jsdoc" : 0
  },
};

以及我的 package.json 的某些部分:

{
  "dependencies": {
    "@emotion/react": "^11.9.3",
    "@emotion/styled": "^11.9.3",
    "@types/jest": "^27.5.2",
    "@types/node": "^16.11.44",
    "@types/react": "^18.0.15",
    "@types/react-dom": "^18.0.6",
    "firebase": "^9.9.0",
    "react": "^18.2.0",
    "react-scripts": "5.0.1",
    "typescript": "^4.7.4",
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "devDependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "^13.5.0",
    "@typescript-eslint/eslint-plugin": "^5.30.6",
    "@typescript-eslint/parser": "^5.30.6",
    "eslint": "^8.19.0",
    "eslint-config-google": "^0.14.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-react": "^7.30.1",
    "eslint-plugin-react-hooks": "^4.6.0",
    "prettier": "2.7.1"
  }
}

我确实会因为未使用的变量之类的事情而收到警告，但不会因为这种特定的违规而收到警告。该项目是使用create-react-app创建的。我还应该在其他地方尝试解决这个问题吗？

Answer 1

我能够用 eslint-plugin-react-hooks 解决这个问题

使用 npm 安装它:npm install eslint-plugin-react-hooks --save-dev

将其添加到.eslintrc:

"extends": [
    "plugin:react-hooks/recommended"
  ],
"plugins": [
    "react-hooks"
  ],