Error AtlasError Documentation and Resolution
Back to searchMore React errors

React

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 called in an unsupported location, such as outside a function component or custom Hook, and stopped rendering with the invalid hook call error.

React error #404runtime

Observed message

Invalid hook call. Hooks can only be called inside of the body of a function component.

Why it happens

  • A Hook is being called conditionally or outside a function component or custom Hook.
  • The app has multiple copies of React installed.
  • A Hook is being called from a regular function instead of a React component or custom Hook.

How to fix it

  1. Move the Hook call into the top level of a function component or custom Hook.
  2. Audit the dependency tree for multiple React installations.
  3. Review shared utilities and event handlers for accidental Hook usage.

Official reference

React Docs: Minified React error #404

Related errors

React error #426React component suspended while responding to synchronous inputReact error #187React flushSync called inside a lifecycle methodReact error #307React Hooks called outside a function componentReact error #321React invalid hook call with mismatched versions or duplicate React

Explore more

ReactBrowse more React errorsruntimeBrowse more runtime errors
React Invalid Hook Call: error #404 explained and fixed | Error Atlas