You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Please describe what the rule should do:
This rule enforces the presence or absence of specific props for specific Vue components. It helps ensure consistency and adherence to project-specific conventions or deprecations by warning developers when required props are missing or when deprecated props are used.
What category should the rule belong to?
[ ] Enforces code style (layout)
[x] Warns about a potential error (problem)
[ ] Suggests an alternate way of doing something (suggestion)
[ ] Other (please specify:)
<template>
<!-- ❌ Should warn: Prop `small` is not passed when it`s required -->
<RedToast />
<!-- ✅ Correct usage: `small` prop is passed -->
<RedToastsmall />
<!-- ❌ Should warn: `rounded` prop is deprecated, use `border-radius` instead -->
<BaseButtonrounded />
<!-- ❌ Should warn: colored` prop is deprecated, use `red` instead -->
<BaseButtoncolored />
<!-- ✅ Correct usage: `red` and `border-radius` props used -->
<BaseButtonredborder-radius="4" />
</template>
Additional context
This rule is highly configurable. Below is an example of how it can be configured in the ESLint settings:
// eslint.config.js
rules: {'vue/require-custom-props': ["warn",{require: [{component: 'RedToast',prop: 'small',message: 'Prop `small` is not passed when it`s required'},{component: 'BlueToast',prop: 'small',message: 'Prop `small` is not passed when it`s required'}],"non-require": [{component: 'BaseButton',prop: 'rounded',message: '`rounded` prop is deprecated, use `border-radius` instead'},{component: 'BaseButton',prop: 'colored',message: '`colored` prop is deprecated, use `red` instead'}]}]}
This rule enables teams to enforce custom prop usage conventions specific to their design systems or codebase standards. It can also be useful during codebase updates to support a smooth migration from legacy components to newer ones by identifying deprecated props and enforcing usage of required ones in new components.
The text was updated successfully, but these errors were encountered:
Please describe what the rule should do:
This rule enforces the presence or absence of specific props for specific Vue components. It helps ensure consistency and adherence to project-specific conventions or deprecations by warning developers when required props are missing or when deprecated props are used.
What category should the rule belong to?
[ ] Enforces code style (layout)
[x] Warns about a potential error (problem)
[ ] Suggests an alternate way of doing something (suggestion)
[ ] Other (please specify:)
Additional context
This rule is highly configurable. Below is an example of how it can be configured in the ESLint settings:
This rule enables teams to enforce custom prop usage conventions specific to their design systems or codebase standards. It can also be useful during codebase updates to support a smooth migration from legacy components to newer ones by identifying deprecated props and enforcing usage of required ones in new components.
The text was updated successfully, but these errors were encountered: