async useEffect ⚛️ React

Warning: useEffect must not return anything besides a function, which is used for clean-up. It looks like you wrote useEffect(async () => ...)

An async function was passed directly to useEffect, so it returns a Promise instead of a cleanup function.

Seen on: React

Meaning

Effects must return nothing or a cleanup function. Define the async function inside the effect and call it.

Common causes

  • useEffect(async () => { … })
  • Returning a value from the effect

⚡ Quick fix

  1. Declare an inner async function and call it
  2. Handle cancellation with an ignore flag or AbortController

Detailed fix by platform

React

  1. jsx
    useEffect(() => {
      let ignore = false;
      (async () => { const d = await load(); if (!ignore) setData(d); })();
      return () => { ignore = true; };
    }, []);

How to diagnose

  1. Effect — Is the callback async?
  2. Recent change — Did it start after a deploy, upgrade, or configuration change? Compare with the last working version.

🧠 Still stuck? Analyze your error

Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.