Description
What rule do you want to change?
New config fields:
- Require using a defined name for the
define*
variable (e.g.{ "name": "props" }
) - Require name prefix in html (not for
vue/define-emits-declaration
e.g.{ "prefix": true }
)
Does this change cause the rule to produce more or fewer warnings?
More (depends on configuration).
How will the change be implemented? (New option, new default behavior, etc.)?
The default behavior does not change the current behavior of the rule.
Please provide some example code that this change will affect:
"vue/define-props-declaration": ["error", "type-based", { "name": "props" } ]
interface Props {
active: boolean;
}
// GOOD
const props = defineProps<Props>();
// BAD
const myProps = defineProps<Props>();
"vue/define-props-declaration": ["error", "type-based", { "prefix": true } ]
<template>
<!-- GOOD-->
{{ props.active }}
<!-- BAD-->
{{ active }}
{{ $props.active }}
</template>
"vue/define-slots-declaration": ["error", "always", { "name": "slots", "prefix": true } ]
<template>
<!-- GOOD-->
{{ slots }}
{{ slots.default }}
<!-- BAD-->
{{ $slots }}
{{ $slots.default }}
</template>
"vue/define-attrs-declaration": ["error", "always", { "name": "attrs", "prefix": true } ]
<template>
<!-- GOOD-->
{{ attrs }}
<!-- BAD-->
{{ $attrs}}
</template>
What does the rule currently do for this code?
https://eslint.vuejs.org/rules/define-props-declaration.html