vercel/next.js · error · Error

No children were passed to <Link> with `href` of `${hrefProp

Error message

No children were passed to <Link> with `href` of `${hrefProp}` but one child is required https://nextjs.org/docs/messages/link-no-children

What it means

In the legacy pages-router Link with legacyBehavior, this error is raised when React.Children.only fails because children is missing entirely — <Link href> was rendered with no child, leaving no element onto which navigation props can be cloned.

Source

Thrown at packages/next/src/client/link.tsx:514

    // This will return the first child, if multiple are provided it will throw an error
    let child: any
    if (legacyBehavior) {
      if (process.env.NODE_ENV === 'development') {
        if (onClick) {
          console.warn(
            `"onClick" was passed to <Link> with \`href\` of \`${hrefProp}\` but "legacyBehavior" was set. The legacy behavior requires onClick be set on the child of next/link`
          )
        }
        if (onMouseEnterProp) {
          console.warn(
            `"onMouseEnter" was passed to <Link> with \`href\` of \`${hrefProp}\` but "legacyBehavior" was set. The legacy behavior requires onMouseEnter be set on the child of next/link`
          )
        }
        try {
          child = React.Children.only(children)
        } catch (err) {
          if (!children) {
            throw new Error(
              `No children were passed to <Link> with \`href\` of \`${hrefProp}\` but one child is required https://nextjs.org/docs/messages/link-no-children`
            )
          }
          throw new Error(
            `Multiple children were passed to <Link> with \`href\` of \`${hrefProp}\` but only one child is supported https://nextjs.org/docs/messages/link-multiple-children` +
              (typeof window !== 'undefined'
                ? " \nOpen your browser's console to view the Component stack trace."
                : '')
          )
        }
      } else {
        child = React.Children.only(children)
      }
    } else {
      if (process.env.NODE_ENV === 'development') {
        if ((children as any)?.type === 'a') {
          throw new Error(
            'Invalid <Link> with <a> child. Please remove <a> or use <Link legacyBehavior>.\nLearn more: https://nextjs.org/docs/messages/invalid-new-link-with-extra-anchor'

View on GitHub (pinned to 0eb3775416)

Solutions

1. Pass exactly one child element to <Link>.

When it happens

Trigger: <Link> in pages router is rendered without children.

Common situations: A Link with href but no child in the pages directory.

AI-assisted analysis of vercel/next.js@0eb3775416 (2026-08-19). Data as JSON: /api/errors/dc423be2772a5e09. Report an issue: GitHub.