oxc-project/oxc · warning · OxcDiagnostic

Namespace tags are not supported by default. React's JSX doe

Error message

Namespace tags are not supported by default. React's JSX doesn't support namespace tags. You can set `throwIfNamespace: false` to bypass this warning.

What it means

During the JSX (React) transform, Oxc warns when a JSX element uses an XML namespace tag name such as `<f:image />` or `<svg:rect />` and the `throwIfNamespace` option is true. The JSX grammar permits namespace names, but React's runtime (`React.createElement`) does not resolve them, so Babel — which Oxc mirrors — defaults `throwIfNamespace` to true. The diagnostic is emitted at crates/oxc_transformer/src/jsx/jsx_impl.rs:826 when `self.options.throw_if_namespace` is set; the option defaults to true (crates/oxc_transformer/src/jsx/options.rs:67-68).

Source

Thrown at crates/oxc_transformer/src/jsx/diagnostics.rs:38

}

#[cold]
#[expect(dead_code)]
pub fn import_source_cannot_be_set() -> OxcDiagnostic {
    OxcDiagnostic::warn("importSource cannot be set when runtime is classic.")
        .with_help("Remove `importSource` option.")
}

#[cold]
#[expect(dead_code)]
pub fn invalid_import_source() -> OxcDiagnostic {
    OxcDiagnostic::warn("importSource cannot be an empty string or longer than u32::MAX bytes")
        .with_help("Fix `importSource` option.")
}

#[cold]
pub fn namespace_does_not_support(span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn("Namespace tags are not supported by default. React's JSX doesn't support namespace tags. You can set `throwIfNamespace: false` to bypass this warning.")
        .with_label(span)
}

#[cold]
pub fn valueless_key(span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn("Please provide an explicit key value. Using \"key\" as a shorthand for \"key={true}\" is not allowed.")
        .with_label(span)
}

View on GitHub (pinned to e1e7af627c)

Solutions

1. Replace the namespace tag with a normal component or property access: `<f:image />` → `<FImage />` or `<f.Image />` style member expressions supported by React
2. If your JSX runtime genuinely handles namespaces, set `throwIfNamespace: false` in the JSX options to silence the warning (matches Babel's escape hatch named in the message)
3. If the file is XML-ish data rather than UI, move it out of JSX (data file, dangerouslySetInnerHTML, or separate template)

Example fix

// before
<svg:rect width="10" height="10" />

// after
<svg>...<rect width="10" height="10" /></svg> // or a wrapper component <SvgRect />

// Scan JSX sources before transform when throwIfNamespace stays true
function containsNamespaceTag(src: string): boolean {
  return /<[A-Za-z][\w.-]*:[A-Za-z][\w.-]*[\s/>]/.test(src);
}
if (containsNamespaceTag(fileContents)) {
  throw new Error(`${file}: JSX namespace tags are rejected by the React transform`);
}

// For data-driven templates, validate tag names before rendering them as JSX
const isPlainTagName = (name: string): boolean => /^[A-Za-z][\w.-]*$/.test(name);
function renderTag(name: string) {
  if (!isPlainTagName(name)) throw new Error(`Unsupported tag name: ${name}`);
  return React.createElement(name);
}

When it happens

Trigger: Transforming `.jsx`/`.tsx` source containing a namespaced element name (JSXMemberExpression-with-namespace / `Ident:Ident` form like `<math:mn>2</math:mn>`) with the JSX plugin enabled and `throwIfNamespace` not explicitly set to false (it defaults to true). Also triggered by copying XML/XSLT/SVG-in-XML snippets straight into JSX.

Common situations: Pasting raw SVG-with-namespace or XSL templates into React components; JSX files authored for non-React JSX runtimes (e.g. Solid, Inferno configs, or old `react-jsx` versions) then compiled with React defaults; teams migrating from Babel who relied on `throwIfNamespace: false` but forgot to carry the option into the oxc/oxc-transform config.

Related errors

• Please provide an explicit key value. Using \"key\" as a sho
• `button` elements must have an explicit `type` attribute.
• `button` elements must have a valid `type` attribute.
• `checked` should be used with either `onChange` or `readOnly
• Use either `checked` or `defaultChecked`, but not both.

AI-assisted analysis of oxc-project/oxc@e1e7af627c (2026-08-20). Data as JSON: /api/errors/ad2328010554b5b3. Report an issue: GitHub.