React
Invalid hook call
Invalid hook call. Hooks can only be called inside of the body of a function component.
React detected a hook being used outside of a valid function component or custom hook context.
Error AtlasError Documentation and ResolutionObserved message
Invalid hook call. Hooks can only be called inside of the body of a function component.
Why it happens
- Hooks were called inside a class component or non-component function.
- Hooks were used conditionally or inside loops.
- Multiple versions of React are installed in the project.
- React and React DOM versions are mismatched.
How to fix it
- Ensure hooks are only called at the top level of function components or custom hooks.
- Remove conditional or loop-based hook usage.
- Check for duplicate React installations using npm ls react.
- Align react and react-dom versions.
Official reference
React Docs: Invalid Hook Call WarningRelated errors
Explore more