vue/no-reserved-keys Correctness
What it does
Disallow overwriting reserved Vue instance keys (e.g. $data, $emit) or using _-prefixed keys inside data / asyncData.
Why is this bad?
Vue exposes a number of instance properties ($emit, $data, $props, etc.). Defining a prop, computed, data, method or setup return key with the same name overwrites the underlying Vue API and silently breaks the component (e.g. methods: { $emit() {} } clobbers event emission). Vue also reserves _-prefixed names inside its reactivity system, so data() { return { _foo: 1 } } may collide with internal state.
Examples
Examples of incorrect code for this rule:
<script>
export default {
props: ["$data"],
methods: {
$emit() {},
},
};
</script>Examples of correct code for this rule:
<script>
export default {
props: ["fooData"],
methods: {
send() {},
},
};
</script>Configuration
groups
type: string[]
default: []
Extra component option groups to inspect, on top of the built-in props / computed / data / asyncData / methods / setup.
reserved
type: string[]
default: []
Extra reserved key names to disallow, on top of the built-in list.
How to use
To enable this rule using the config file or in the CLI, you can use:
{
"plugins": ["vue"],
"rules": {
"vue/no-reserved-keys": "error"
}
}import { defineConfig } from "oxlint";
export default defineConfig({
plugins: ["vue"],
rules: {
"vue/no-reserved-keys": "error",
},
});oxlint --deny vue/no-reserved-keys --vue-pluginVersion
This rule was added in vnext.