oxc-project/oxc · warning · OxcDiagnostic
Name "{name}" is reserved in Vue.js.
Error message
Name "{name}" is reserved in Vue.js. What it means
The Vue-2 built-ins variant of vue/no-reserved-component-names: 'Name "{name}" is reserved in Vue.js.' It fires for Vue 2 built-in component names (VUE2_BUILTIN_COMPONENT_NAMES, e.g. `Transition`, `KeepAlive`, and friends) when the `disallowVueBuiltInComponents` option is enabled. Using these names shadows Vue's own global components, so resolution depends on registration order and easily breaks.
Source
Thrown at crates/oxc_linter/src/rules/vue/no_reserved_component_names.rs:33
rule::{DefaultRuleConfig, Rule},
utils::{
VUE_RESERVED_DEPRECATED_HTML_ELEMENTS, VUE_RESERVED_HTML_ELEMENTS,
VUE_RESERVED_KEBAB_CASE_ELEMENTS, VUE_RESERVED_SVG_ELEMENTS, VUE2_BUILTIN_COMPONENT_NAMES,
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,
}View on GitHub (pinned to e1e7af627c)
Solutions
- Rename the component (e.g. `FadeTransition`, `AppKeepAlive`).
- If you meant to wrap the built-in, keep the built-in name in the template and rename only your wrapper component.
- If the collision is intentional and versioned, document it — but renaming is the durable fix.
- Re-run oxlint with the option still enabled to confirm.
Example fix
// before
export default {
name: 'Transition' // reserved in Vue.js
}
// after
export default {
name: 'FadeTransition'
} Defensive patterns
Strategy: validation
Prevention
- Enable `disallowVueBuiltInComponents` in shared lint configs so collisions surface early.
- Never name your own components Transition, KeepAlive, or other Vue 2 built-ins.
- During Vue 2 -> 3 migrations, sweep for built-in-named components proactively.
When it happens
Trigger: Enabling the rule's `disallowVueBuiltInComponents` option and naming a component `Transition`, `KeepAlive`, or another Vue 2 built-in from the util list.
Common situations: Design systems that ship their own `Transition` wrapper; migrating a Vue 2 app where a local component was named after a built-in; enabling the stricter option during a lint-config upgrade and surfacing old names.
Related errors
- Name "{name}" is reserved.
- Name "{name}" is reserved in Vue.js 3.x.
- Name "{name}" is reserved in HTML.
- `VirtualFree` failed during cleanup: {err}
- Key `{name}` is reserved.
AI-assisted analysis of oxc-project/oxc@e1e7af627c (2026-08-20).
Data as JSON: /api/errors/681914f0b8f879ce.
Report an issue: GitHub.