React Diagnostic

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

React enforces strict Hook Rules: hooks cannot be called inside loops, conditions, nested functions, or regular non-React JS utility functions. Also triggered when multiple React versions are bundled.

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

Quick Fix Checklist

  1. Run npm ls react in project root to verify there is only 1 single copy of React installed
  2. Move all use* hook invocations to the top level of your component body before any early return statements
  3. If using npm link, configure vite.config.ts or webpack resolve.alias to point to the root node_modules/react