facebook/react · error · Error

link is a self-closing tag and must neither have `children`

Error message

link is a self-closing tag and must neither have `children` nor use `dangerouslySetInnerHTML`.

What it means

Thrown by pushStartLink when a <link> element carries a non-null children or dangerouslySetInnerHTML prop. <link> is a void/self-closing element (no end tag in HTML), so children would be dropped by the parser and innerHTML has no content slot; React throws during serialization instead of silently emitting broken markup.

Source

Thrown at packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js:3111

  }
}

function pushLinkImpl(
  target: Array<Chunk | PrecomputedChunk>,
  props: Object,
): null {
  target.push(startChunkForTag('link'));

  for (const propKey in props) {
    if (hasOwnProperty.call(props, propKey)) {
      const propValue = props[propKey];
      if (propValue == null) {
        continue;
      }
      switch (propKey) {
        case 'children':
        case 'dangerouslySetInnerHTML':
          throw new Error(
            `${'link'} is a self-closing tag and must neither have \`children\` nor ` +
              'use `dangerouslySetInnerHTML`.',
          );
        default:
          pushAttribute(target, propKey, propValue);
          break;
      }
    }
  }

  // Link never participate as a ViewTransition

  target.push(endOfStartTagSelfClosing);
  return null;
}

function pushStyle(
  target: Array<Chunk | PrecomputedChunk>,

View on GitHub (pinned to eafeac097b)

Solutions

  1. Self-close the link and drop the children: <link rel="stylesheet" href="x" />
  2. Destructure children out before spreading: const {children, ...rest} = props; <link {...rest} />
  3. If you meant to inline styles, use <style dangerouslySetInnerHTML={{__html: css}} /> instead

Example fix

// before
<link rel="stylesheet" href="/app.css">fallback</link>

// after
<link rel="stylesheet" href="/app.css" />
Defensive patterns

Strategy: type-guard

Validate before calling

const {children, dangerouslySetInnerHTML, ...linkProps} = props;
return <link {...linkProps} />;

Type guard

type LinkProps = JSX.IntrinsicElements['link'] & {children?: never; dangerouslySetInnerHTML?: never};

Prevention

When it happens

Trigger: JSX like <link rel="stylesheet" href="x">fallback</link>, or spreading a props object containing children onto <link rel="icon" ... />, or attempting dangerouslySetInnerHTML on it.

Common situations: Spread props in SEO/head-manager components (next/head-style utilities, custom Meta components) accidentally including children; HTML-to-JSX conversion of <link>...</link>; attempting to inline CSS 'into' a stylesheet link.

Related errors


AI-assisted analysis of facebook/react@eafeac097b (2026-08-21). Data as JSON: /api/errors/4da66eb61a8aedd1. Report an issue: GitHub.