react-hooks/exhaustive-deps not showing in VS code

user_10795348 0
Viewed 1261

I have a .eslintrc file with the following rules:

"rules": {
    "prettier/prettier": "error",
    "react-hooks/rules-of-hooks": "error",
    "react-hooks/exhaustive-deps": "error",
    "no-console": "warn"
},

I've installed: eslint-plugin-prettier, eslint-config-prettier and eslint-plugin-react-hooks

I've enabled "eslint.validate": [ "javascript", "javascriptreact", "html", "typescriptreact" ], in settings.json in vscode

but when I remove dependencies that are needed in a useEffect, it's not showing an error that I hoped it would

what else do I need to do?

react-hooks eslint reactjs
2 Answers

In .eslintrc, along with to adding rules, you must add react-hooks in the list of plugins

{
  "plugins": [
    // ...
    "react-hooks"
  ],
  "rules": {
    // ...
    "react-hooks/rules-of-hooks": "error",
    "react-hooks/exhaustive-deps": "error"
  }
}
user_66551600

This worked for me only when I updated react-scripts to 4.x.x

It also helps to restart the ESLint server in VScode after doing this

hgb123 answer also is useful if you haven't already done that

user_107953480
Related