Error map
createContext only works in Client Components Next.js: You're importing a component that needs createContext. It only works in a Client Component but none of its parents are marked with "use client"
Next.js · layer 1, On your device
Centre: this error. First ring: errors it is linked with (12). Outer ring: what those are linked with. Colours show the layer of a request each error belongs to. Click any dot to re-centre the map on it; hover to follow its connections. The centre dot opens the error page.
Directly related (12)
Error: No QueryClient set, use QueryClientProvider to set one
TanStack Query hooks ran outside a QueryClientProvider (or a duplicate copy of the library is installed).
Error: Functions cannot be passed directly to Client Components unless you explicitly expose it by marking it with "use server".
A Server Component passed a function prop to a Client Component.
Error: useNavigate() may be used only in the context of a <Router> component.
A React Router hook ran in a component that isn’t rendered inside a Router provider.
TypeError: Cannot destructure property 'user' of 'useContext(...)' as it is undefined.
A component read a context with no matching Provider above it.
Next.js: You're importing a component that needs "server-only". That only works in a Server Component
A Client Component (or a file it imports) pulls in server-only code — database clients, secrets, next/headers or a module marked…
You're importing a component that needs useState. It only works in a Client Component but none of its parents are marked with "use client"
In the Next.js App Router, a component using hooks or browser APIs is rendered as a Server Component.
Browser: Access to fetch at 'https://api.example.com/api/data' from origin 'https://app.example.com' has been blocked by CORS policy (Next.js route handler)
A cross-origin request to your Next.js API route is blocked because the response lacks CORS headers.
Next.js: You have a Server Component that imports next/router. Use next/navigation instead
`next/router` (Pages Router) was imported in an App Router component.
Next.js: Error occurred prerendering page "/blog" TypeError: fetch failed { cause: Error: connect ECONNREFUSED 127.0.0.1:3000 }
During `next build` a page tried to fetch data from a server (often your own app or an API) that isn't running yet.
Next.js: Error: No HTTP methods exported in '/app/api/users/route.ts'. Export a named export for each HTTP method (GET, POST...)
A Route Handler file exports no recognised HTTP method function.
Next.js: You are attempting to export "metadata" from a component marked with "use client", which is disallowed
`metadata`/`generateMetadata` can only be exported from Server Components.
Next.js: Error: You cannot use different slug names for the same dynamic path ('id' !== 'slug')
Sibling dynamic folders at the same level use different parameter names.
Two steps away (32)
Warning: A component is changing an uncontrolled input to be controlled
An input’s `value` started as `undefined` (uncontrolled) and later became a defined value (controlled), or vice versa.
RuntimeError: Working outside of application context.
Code used current_app, g, or a Flask extension (like SQLAlchemy) without an active Flask application context.
Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment <>...</>?
A component returns two sibling JSX elements without a single parent.
Error: Hydration failed because the initial UI does not match what was rendered on the server
The HTML rendered on the server differs from the first client render, so React (Next.js/Remix) can’t attach to it.
Module not found: Can't resolve 'fs' (Next.js / webpack 5)
A Node.js built-in (fs, path, crypto, net) is imported into code that runs in the browser bundle.
Error: Dynamic server usage: Route /x couldn't be rendered statically because it used `cookies`
Next.js tried to statically render a route that reads request-specific data (cookies, headers, searchParams).
Warning: Cannot update a component (`Parent`) while rendering a different component (`Child`)
A child component updated a parent’s state during its render instead of in an effect or event handler.
No routes matched location "/x"
React Router found no route definition for the current URL.
Warning: An update to Component inside a test was not wrapped in act(...)
A component updated state after the test’s synchronous assertions — async work wasn’t awaited.
TypeError: Cannot read properties of undefined (reading 'x')
You tried to access a property on a value that is `undefined` (or `null`) — usually data that hasn’t loaded yet or a wrong proper…
TypeError: Cannot set properties of undefined (setting 'x')
Code assigned a property on a value that is undefined (or null).
TypeError: x is not iterable
for…of, spread or destructuring was used on something that isn’t an array/iterable.
Error: async/await is not yet supported in Client Components, only Server Components.
A component marked "use client" was declared async.
Next.js: Error: NEXT_REDIRECT (redirect() inside try/catch)
redirect() works by throwing a special error; catching it in try/catch (or a .catch) swallows the redirect and logs NEXT_REDIRECT.
Next.js 15: Route "/x" used `cookies().get('token')`. `cookies()` should be awaited before using its value
Since Next.js 15, cookies(), headers(), params and searchParams are async — they must be awaited.
Error: Invalid src prop on `next/image`, hostname "x" is not configured under images in your `next.config.js`
next/image refuses to optimize images from domains not allowed in next.config.js.
Error occurred prerendering page "/x". Read more: https://nextjs.org/docs/messages/prerender-error
A page threw an error while Next.js was rendering it at build time.
Error: NextRouter was not mounted.
next/router’s useRouter was used inside the App Router (app/ directory), which uses next/navigation instead.
Browser: Access to XMLHttpRequest at 'https://api.example.com' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header — Laravel
The browser blocked a cross-origin call to your Laravel API because the response lacks the right CORS headers.
Next.js: Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p> / In HTML, <p> cannot be a descendant of <p>. This will cause a hydration error
The rendered HTML has an invalid element nesting, so the browser "fixes" it and React's hydration no longer matches.
Next.js 15: Error: Route "/blog/[slug]" used `params.slug`. `params` should be awaited before using its properties
In Next.js 15 `params` and `searchParams` are Promises; reading properties synchronously triggers this error/warning.
Next.js: Error: Failed prop type: The prop `href` expects a `string` or `object` in `<Link>`, but got `undefined` instead
`` received `undefined` (or another invalid value), so Next.js can't build the link.
Next.js 13+: Error: Invalid <Link> with <a> child. Please remove <a> or use <Link legacyBehavior>
Since Next.js 13 `` renders its own ``, so nesting your own `` is invalid.
Vue Router: Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/home"
`router.push` to the route you're already on, rejecting the promise (Vue Router 3.1+).
npm ERR! code ELIFECYCLE / Command failed with exit code 1
An npm script (build, start, test, postinstall) exited with an error. ELIFECYCLE is only the wrapper — the real error is printed…
gyp ERR! build error / node-gyp rebuild failed
A dependency with native C/C++ code couldn’t compile — missing build tools, Python, or an unsupported Node version.
Error: error:0308010C:digital envelope routines::unsupported
An old build tool (webpack 4, old react-scripts) uses a hash algorithm that OpenSSL 3 in Node 17+ disables.
Next.js: ⨯ Conflicting app and page file was found, please remove the conflicting files to continue: "pages/index.tsx" - "app/page.tsx"
The same URL is defined in both the `app` and `pages` directories.
Next.js: FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory (during next build)
Node ran out of memory while building a large Next.js app (or on a small CI/Vercel runner).
TypeError: Missing parameter name at 1 (path-to-regexp)
An Express 5 (path-to-regexp v8) route uses old wildcard syntax like '*' or '/:id?'.
Next.js: Page "/blog/[slug]" is missing "generateStaticParams()" so it cannot be used with "output: export" config
A dynamic route can't be statically exported without telling Next.js which paths to generate.
Vue Router: [Vue Router warn]: No match found for location with path "/users/42"
The router has no route record matching that path (typo, missing route, or case/base issue).
Map another error
Popular: 500403400ORA-009331064Critical errorFileNotFoundException assemblyTypeError