oxc-project/oxc · warning · OxcDiagnostic

Name "{name}" is reserved in Vue.js 3.x.

Error message

Name "{name}" is reserved in Vue.js 3.x.

What it means

The Vue-3 variant of vue/no-reserved-component-names: 'Name "{name}" is reserved in Vue.js 3.x.' It covers the Vue 3 built-in set (VUE3_BUILTIN_COMPONENT_NAMES_EXTRA, e.g. `Teleport`, `Suspense`) and, per the option's doc comment, also catches Vue 2 built-ins because Vue 3's set includes them. Enabled via the rule's `disallowVue3BuiltInComponents` option.

Source

Thrown at crates/oxc_linter/src/rules/vue/no_reserved_component_names.rs:37

        VUE3_BUILTIN_COMPONENT_NAMES_EXTRA, find_property,
        is_vue_component_options_object_excluding_instance,
    },
};

fn reserved_diagnostic(name: &str, span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn(format!("Name \"{name}\" is reserved.")).with_label(span)
}

fn reserved_in_html_diagnostic(name: &str, span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn(format!("Name \"{name}\" is reserved in HTML.")).with_label(span)
}

fn reserved_in_vue_diagnostic(name: &str, span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn(format!("Name \"{name}\" is reserved in Vue.js.")).with_label(span)
}

fn reserved_in_vue3_diagnostic(name: &str, span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn(format!("Name \"{name}\" is reserved in Vue.js 3.x.")).with_label(span)
}

#[derive(Debug, Default, Clone, JsonSchema, Deserialize)]
#[serde(rename_all = "camelCase", default, deny_unknown_fields)]
pub struct NoReservedComponentNames {
    /// Disallow Vue 2 built-in component names (e.g. `Transition`, `KeepAlive`).
    disallow_vue_built_in_components: bool,
    /// Disallow Vue 3 built-in component names (e.g. `Teleport`, `Suspense`).
    /// Note: this also catches Vue 2 built-ins because Vue 3's set includes them.
    disallow_vue3_built_in_components: bool,
    /// Match HTML / SVG element names case-sensitively. When `false` (default),
    /// the capitalized form of an HTML element (e.g. `Div`) is also reported.
    html_element_case_sensitive: bool,
}

declare_oxc_lint!(
    /// ### What it does
    ///

View on GitHub (pinned to e1e7af627c)

Solutions

1. Rename the component so it does not collide with any Vue 3 built-in.
2. If you wrapped a built-in to add props, rename the wrapper and keep the built-in name in templates.
3. Leave the option enabled in CI so future names are caught at review time.
4. Re-run oxlint to confirm.

Example fix

// before
export default {
  name: 'Teleport' // reserved in Vue.js 3.x
}

// after
export default {
  name: 'PortalTarget'
}

When it happens

Trigger: Enabling `disallowVue3BuiltInComponents` and naming a component `Teleport`, `Suspense`, `Transition`, or any other name in the Vue 3 built-in list.

Common situations: Vue 3 migrations where local components collide with newly-added built-ins (`Teleport`, `Suspense`); enabling the stricter option as part of adopting Vue 3 lint presets; wrapper components that reused built-in names.

Related errors

• Name "{name}" is reserved.
• Name "{name}" is reserved in Vue.js.
• Name "{name}" is reserved in HTML.
• `VirtualFree` failed during cleanup: {err}
• Object declaration on `data` property is deprecated.

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