Failed prop type: The prop href expects a string or object in <Link> Next.js Origin: On your device OSI layer 7 · Application Last updated 5 Nov 2026

Next.js: Error: Failed prop type: The prop `href` expects a `string` or `object` in `<Link>`, but got `undefined` instead

<Link href> received undefined (or another invalid value), so Next.js can't build the link.

Exact message you may see Failed prop type: The prop `href` expects a `string` or `object` in `<Link>`, but got `undefined` insteadThe prop href expects a string or object in <Link>, but got undefinedError: Failed prop type: The prop `href` expects a `string` or `object`Invalid href passed to next/router
Explore the map of this error Full error map →
Seen on: Next.js React

Meaning

The href variable is undefined at render: missing data, a wrong field name, or an async value not loaded yet. Provide a fallback (href={item.url ?? "#"}) or render the link only when data exists. For objects: { pathname, query }.

Common causes

  • href from undefined/null data
  • Wrong property name (item.slug vs item.path)
  • Data not loaded when rendering
  • Empty string href in list items
  • Passing a number/boolean

⚡ Quick fix

  1. Guard: {item.url && <Link href={item.url}>…</Link>}
  2. Verify the field name in the data
  3. Use href={{ pathname: "/p/[id]", query: { id } }} for objects

Detailed fix by platform

Next.js

  1. <Link href={post.slug ? /blog/${post.slug} : "/blog"}>{post.title}</Link>

How to diagnose

  1. Value — undefined?
  2. Field — Correct name?
  3. Timing — Loaded?

🔧 Still not fixed?

Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:

Where this error sits

Origin: On your device. Errors that are often confused with or caused by this one (click to open):

[Vue warn]: Invalid prop: type check failed — Vue: [Vue warn]: Invalid prop: type check failed for prop "count". Expected Number with value 5, got String with value "5" (Vue)[Vue warn]: Invalid p…[Vue warn]: Missing required prop — Vue: [Vue warn]: Missing required prop: "title" (Vue)[Vue warn]: Missing r…[Vue warn]: Set operation on key failed: target is readonly — Vue: [Vue warn]: Set operation on key "name" failed: target is readonly. (Vue)[Vue warn]: Set opera…Conflicting app and page file was found — Next.js: ⨯ Conflicting app and page file was found, please remove the conflicting files to continue: "pages/index.tsx" - "app/page.tsx" (Next.js)Conflicting app and p…CORS error calling Next.js API route / route handler — 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) (Next.js)CORS error calling Ne…Invalid <Link> with <a> child. Please remove <a> — Next.js 13+: Error: Invalid <Link> with <a> child. Please remove <a> or use <Link legacyBehavior> (Next.js)Invalid <Link> with <…key is not a prop — Warning: `key` is not a prop. Trying to access it will result in `undefined` being returned. (React)key is not a propneeds useState — 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" (React)needs useStateFailed pr…

Explore the map of this error Full error map →

🧠 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.

💬 What worked for others

No tips yet — did something else fix this for you?

Share what worked for you

Tips are checked by an editor before they appear. Links are removed.