I am getting the following eslint error after adding // eslint-disable-next-line react-hooks/exhaustive-deps
in my code.
8:14 error Definition for rule 'react-hooks/exhaustive-deps' was not found
I referred to this post to fix this but the solution mentioned doesn't work in my case. Any clue how to suppress this eslint error?
PS I'm using standardjs in conjuction.
The "react-hooks/exhaustive-deps" rule warns us when we have a missing dependency in an effect hook. To get rid of the warning, move the function or variable declaration inside of the useEffect hook, memoize arrays and objects that change on every render or disable the rule.
Instead, always use Hooks at the top level of your React function, before any early returns. By following this rule, you ensure that Hooks are called in the same order each time a component renders. That's what allows React to correctly preserve the state of Hooks between multiple useState and useEffect calls.
React Hook "useClickAway" is called conditionally. React Hooks must be called in the exact same order in every component render. Did you accidentally call a React Hook after an early return?
Hooks are functions that let you “hook into” React state and lifecycle features from function components. Hooks don't work inside classes — they let you use React without classes. (We don't recommend rewriting your existing components overnight but you can start using Hooks in the new ones if you'd like.)
This typically happens because the react-hooks
plugin is missing in the .eslintrc
plugin configuration. Ensure you have added react-hooks
as in the example below:
"plugins": ["react", "react-hooks",],
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With