Skip to content

New rule vue/require-macro-variable-name #2188

Closed
@szulcus

Description

@szulcus

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

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions