Skip to content

Available rules ​

Legend

πŸ”§ Indicates that the rule is fixable, and using --fix option on the command line can automatically fix some of the reported problems.

πŸ’‘ Indicates that some problems reported by the rule are manually fixable by editor suggestions.

Mark indicating rule type:

  • ⚠️ Possible Problems: These rules relate to possible logic errors in code.
  • πŸ”¨ Suggestions: These rules suggest alternate ways of doing things.
  • πŸ’„ Layout & Formatting: These rules care about how the code looks rather than how it executes.

Base Rules (Enabling Correct ESLint Parsing) ​

Rules in this category are enabled for all presets provided by eslint-plugin-vue.

Rule IDDescription
vue/comment-directivesupport comment-directives in <template>⚠️
vue/jsx-uses-varsprevent variables used in JSX to be marked as unused⚠️

Priority A: Essential (Error Prevention) ​

  • 3️⃣ Indicates that the rule is for Vue 3 and is included in all of "plugin:vue/essential", *.configs["flat/essential"], "plugin:vue/strongly-recommended", *.configs["flat/strongly-recommended"], "plugin:vue/recommended" and *.configs["flat/recommended"] presets.
  • 2️⃣ Indicates that the rule is for Vue 2 and is included in all of "plugin:vue/vue2-essential",*.configs["flat/vue2-essential"], "plugin:vue/vue2-strongly-recommended",*.configs["flat/vue2-strongly-recommended"] and "plugin:vue/vue2-recommended",*.configs["flat/vue2-recommended"] presets.
Rule IDDescription
vue/multi-word-component-namesrequire component names to be always multi-word3️⃣2οΈβƒ£πŸ”¨
vue/no-arrow-functions-in-watchdisallow using arrow functions to define watcher3️⃣2οΈβƒ£βš οΈ
vue/no-async-in-computed-propertiesdisallow asynchronous actions in computed properties3️⃣2οΈβƒ£βš οΈ
vue/no-child-contentdisallow element's child contents which would be overwritten by a directive like v-html or v-textπŸ’‘3️⃣2οΈβƒ£βš οΈ
vue/no-computed-properties-in-datadisallow accessing computed properties in data3️⃣2οΈβƒ£βš οΈ
vue/no-custom-modifiers-on-v-modeldisallow custom modifiers on v-model used on the component2οΈβƒ£βš οΈ
vue/no-deprecated-data-object-declarationdisallow using deprecated object declaration on data (in Vue.js 3.0.0+)πŸ”§3οΈβƒ£βš οΈ
vue/no-deprecated-delete-setdisallow using deprecated $delete and $set (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-destroyed-lifecycledisallow using deprecated destroyed and beforeDestroy lifecycle hooks (in Vue.js 3.0.0+)πŸ”§3οΈβƒ£βš οΈ
vue/no-deprecated-dollar-listeners-apidisallow using deprecated $listeners (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-dollar-scopedslots-apidisallow using deprecated $scopedSlots (in Vue.js 3.0.0+)πŸ”§3οΈβƒ£βš οΈ
vue/no-deprecated-events-apidisallow using deprecated events api (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-filterdisallow using deprecated filters syntax (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-functional-templatedisallow using deprecated the functional template (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-html-element-isdisallow using deprecated the is attribute on HTML elements (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-inline-templatedisallow using deprecated inline-template attribute (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-model-definitiondisallow deprecated model definition (in Vue.js 3.0.0+)πŸ’‘3οΈβƒ£βš οΈ
vue/no-deprecated-props-default-thisdisallow deprecated this access in props default function (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-router-link-tag-propdisallow using deprecated tag property on RouterLink (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-scope-attributedisallow deprecated scope attribute (in Vue.js 2.5.0+)πŸ”§3οΈβƒ£πŸ”¨
vue/no-deprecated-slot-attributedisallow deprecated slot attribute (in Vue.js 2.6.0+)πŸ”§3οΈβƒ£πŸ”¨
vue/no-deprecated-slot-scope-attributedisallow deprecated slot-scope attribute (in Vue.js 2.6.0+)πŸ”§3οΈβƒ£πŸ”¨
vue/no-deprecated-v-bind-syncdisallow use of deprecated .sync modifier on v-bind directive (in Vue.js 3.0.0+)πŸ”§3οΈβƒ£βš οΈ
vue/no-deprecated-v-isdisallow deprecated v-is directive (in Vue.js 3.1.0+)3οΈβƒ£πŸ”¨
vue/no-deprecated-v-on-native-modifierdisallow using deprecated .native modifiers (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-deprecated-v-on-number-modifiersdisallow using deprecated number (keycode) modifiers (in Vue.js 3.0.0+)πŸ”§3οΈβƒ£βš οΈ
vue/no-deprecated-vue-config-keycodesdisallow using deprecated Vue.config.keyCodes (in Vue.js 3.0.0+)3οΈβƒ£βš οΈ
vue/no-dupe-keysdisallow duplication of field names3️⃣2οΈβƒ£βš οΈ
vue/no-dupe-v-else-ifdisallow duplicate conditions in v-if / v-else-if chains3️⃣2οΈβƒ£βš οΈ
vue/no-duplicate-attributesdisallow duplication of attributes3️⃣2οΈβƒ£βš οΈ
vue/no-export-in-script-setupdisallow export in <script setup>3️⃣2οΈβƒ£βš οΈ
vue/no-expose-after-awaitdisallow asynchronously registered expose3οΈβƒ£βš οΈ
vue/no-lifecycle-after-awaitdisallow asynchronously registered lifecycle hooks3οΈβƒ£πŸ”¨
vue/no-multiple-template-rootdisallow adding multiple root nodes to the template2οΈβƒ£βš οΈ
vue/no-mutating-propsdisallow mutation of component props3️⃣2οΈβƒ£πŸ”¨
vue/no-parsing-errordisallow parsing errors in <template>3️⃣2οΈβƒ£βš οΈ
vue/no-ref-as-operanddisallow use of value wrapped by ref() (Composition API) as an operandπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/no-reserved-component-namesdisallow the use of reserved names in component definitions3️⃣2οΈβƒ£πŸ”¨
vue/no-reserved-keysdisallow overwriting reserved keys3️⃣2οΈβƒ£πŸ”¨
vue/no-reserved-propsdisallow reserved names in props3️⃣2οΈβƒ£βš οΈ
vue/no-shared-component-dataenforce component's data property to be a functionπŸ”§3️⃣2οΈβƒ£βš οΈ
vue/no-side-effects-in-computed-propertiesdisallow side effects in computed properties3️⃣2οΈβƒ£βš οΈ
vue/no-template-keydisallow key attribute on <template>3️⃣2οΈβƒ£βš οΈ
vue/no-textarea-mustachedisallow mustaches in <textarea>3️⃣2οΈβƒ£βš οΈ
vue/no-unused-componentsdisallow registering components that are not used inside templates3️⃣2οΈβƒ£πŸ”¨
vue/no-unused-varsdisallow unused variable definitions of v-for directives or scope attributesπŸ’‘3️⃣2οΈβƒ£πŸ”¨
vue/no-use-computed-property-like-methoddisallow use computed property like method3️⃣2οΈβƒ£βš οΈ
vue/no-use-v-if-with-v-fordisallow using v-if on the same element as v-for3️⃣2οΈβƒ£πŸ”¨
vue/no-useless-template-attributesdisallow useless attribute on <template>3️⃣2οΈβƒ£βš οΈ
vue/no-v-for-template-key-on-childdisallow key of <template v-for> placed on child elements3οΈβƒ£βš οΈ
vue/no-v-for-template-keydisallow key attribute on <template v-for>🚫2οΈβƒ£βš οΈ
vue/no-v-model-argumentdisallow adding an argument to v-model used in custom component🚫2οΈβƒ£βš οΈ
vue/no-v-text-v-html-on-componentdisallow v-text / v-html on component3️⃣2οΈβƒ£βš οΈ
vue/no-watch-after-awaitdisallow asynchronously registered watch3οΈβƒ£πŸ”¨
vue/prefer-import-from-vueenforce import from 'vue' instead of import from '@vue/*'πŸ”§3οΈβƒ£πŸ”¨
vue/require-component-isrequire v-bind:is of <component> elements3️⃣2οΈβƒ£βš οΈ
vue/require-prop-type-constructorrequire prop type to be a constructorπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/require-render-returnenforce render function to always return value3️⃣2οΈβƒ£βš οΈ
vue/require-slots-as-functionsenforce properties of $slots to be used as a function3οΈβƒ£βš οΈ
vue/require-toggle-inside-transitionrequire control the display of the content inside <transition>3οΈβƒ£βš οΈ
vue/require-v-for-keyrequire v-bind:key with v-for directives3️⃣2οΈβƒ£βš οΈ
vue/require-valid-default-propenforce props default values to be valid3️⃣2οΈβƒ£πŸ”¨
vue/return-in-computed-propertyenforce that a return statement is present in computed property3️⃣2οΈβƒ£βš οΈ
vue/return-in-emits-validatorenforce that a return statement is present in emits validator3️⃣2οΈβƒ£βš οΈ
vue/use-v-on-exactenforce usage of exact modifier on v-on3️⃣2οΈβƒ£πŸ”¨
vue/valid-attribute-namerequire valid attribute names3️⃣2οΈβƒ£βš οΈ
vue/valid-define-emitsenforce valid defineEmits compiler macro3️⃣2οΈβƒ£βš οΈ
vue/valid-define-optionsenforce valid defineOptions compiler macro3οΈβƒ£βš οΈ
vue/valid-define-propsenforce valid defineProps compiler macro3️⃣2οΈβƒ£βš οΈ
vue/valid-model-definitionrequire valid keys in model option🚫2οΈβƒ£βš οΈ
vue/valid-next-tickenforce valid nextTick function callsπŸ”§πŸ’‘3️⃣2οΈβƒ£βš οΈ
vue/valid-template-rootenforce valid template root3️⃣2οΈβƒ£βš οΈ
vue/valid-v-bind-syncenforce valid .sync modifier on v-bind directives🚫2οΈβƒ£βš οΈ
vue/valid-v-bindenforce valid v-bind directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-cloakenforce valid v-cloak directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-else-ifenforce valid v-else-if directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-elseenforce valid v-else directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-forenforce valid v-for directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-htmlenforce valid v-html directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-ifenforce valid v-if directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-isenforce valid v-is directives3οΈβƒ£βš οΈ
vue/valid-v-memoenforce valid v-memo directives3οΈβƒ£βš οΈ
vue/valid-v-modelenforce valid v-model directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-onenforce valid v-on directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-onceenforce valid v-once directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-preenforce valid v-pre directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-showenforce valid v-show directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-slotenforce valid v-slot directives3️⃣2οΈβƒ£βš οΈ
vue/valid-v-textenforce valid v-text directives3️⃣2οΈβƒ£βš οΈ
  • 3️⃣ Indicates that the rule is for Vue 3 and is included in all of "plugin:vue/strongly-recommended", *.configs["flat/strongly-recommended"], "plugin:vue/recommended" and *.configs["flat/recommended"] presets.
  • 2️⃣ Indicates that the rule is for Vue 2 and is included in "plugin:vue/vue2-strongly-recommended",*.configs["flat/vue2-strongly-recommended"] and "plugin:vue/vue2-recommended",*.configs["flat/vue2-recommended"] presets.
Rule IDDescription
vue/attribute-hyphenationenforce attribute naming style on custom components in templateπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/component-definition-name-casingenforce specific casing for component definition nameπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/first-attribute-linebreakenforce the location of first attributeπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/html-closing-bracket-newlinerequire or disallow a line break before tag's closing bracketsπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/html-closing-bracket-spacingrequire or disallow a space before tag's closing bracketsπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/html-end-tagsenforce end tag styleπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/html-indentenforce consistent indentation in <template>πŸ”§3️⃣2οΈβƒ£πŸ’„
vue/html-quotesenforce quotes style of HTML attributesπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/html-self-closingenforce self-closing styleπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/max-attributes-per-lineenforce the maximum number of attributes per lineπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/multiline-html-element-content-newlinerequire a line break before and after the contents of a multiline elementπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/mustache-interpolation-spacingenforce unified spacing in mustache interpolationsπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/no-multi-spacesdisallow multiple spacesπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/no-spaces-around-equal-signs-in-attributedisallow spaces around equal signs in attributeπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/no-template-shadowdisallow variable declarations from shadowing variables declared in the outer scope3️⃣2οΈβƒ£πŸ”¨
vue/one-component-per-fileenforce that each component should be in its own file3️⃣2οΈβƒ£πŸ”¨
vue/prop-name-casingenforce specific casing for the Prop name in Vue components3️⃣2οΈβƒ£πŸ”¨
vue/require-default-proprequire default value for props3️⃣2οΈβƒ£πŸ”¨
vue/require-explicit-emitsrequire emits option with name triggered by $emit()πŸ’‘3οΈβƒ£πŸ”¨
vue/require-prop-typesrequire type definitions in props3️⃣2οΈβƒ£πŸ”¨
vue/singleline-html-element-content-newlinerequire a line break before and after the contents of a singleline elementπŸ”§3️⃣2οΈβƒ£πŸ’„
vue/v-bind-styleenforce v-bind directive styleπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/v-on-event-hyphenationenforce v-on event naming style on custom components in templateπŸ”§3οΈβƒ£πŸ”¨
vue/v-on-styleenforce v-on directive styleπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/v-slot-styleenforce v-slot directive styleπŸ”§3️⃣2οΈβƒ£πŸ”¨
  • 3️⃣ Indicates that the rule is for Vue 3 and is included in "plugin:vue/recommended" and *.configs["flat/recommended"] presets.
  • 2️⃣ Indicates that the rule is for Vue 2 and is included in "plugin:vue/vue2-recommended",*.configs["flat/vue2-recommended"] preset.
Rule IDDescription
vue/attributes-orderenforce order of attributesπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/block-orderenforce order of component top-level elementsπŸ”§3️⃣2οΈβƒ£πŸ”¨
vue/no-lone-templatedisallow unnecessary <template>3️⃣2οΈβƒ£βš οΈ
vue/no-multiple-slot-argsdisallow passing multiple arguments to scoped slots3️⃣2οΈβƒ£βš οΈ
vue/no-required-prop-with-defaultenforce props with default values to be optionalπŸ”§πŸ’‘3️⃣2οΈβƒ£βš οΈ
vue/no-v-htmldisallow use of v-html to prevent XSS attack3️⃣2οΈβƒ£πŸ”¨
vue/order-in-componentsenforce order of properties in componentsπŸ”§πŸ’‘3️⃣2οΈβƒ£πŸ”¨
vue/this-in-templatedisallow usage of this in templateπŸ”§3️⃣2οΈβƒ£πŸ”¨

Uncategorized ​

No preset enables the rules in this category. Please enable each rule if you want.

For example:

json
{  "rules": {  "vue/block-lang": "error"  } }
Rule IDDescription
vue/block-langdisallow use other than available langπŸ”¨
vue/block-tag-newlineenforce line breaks after opening and before closing block-level tagsπŸ”§πŸ’„
vue/component-api-styleenforce component API styleπŸ”¨
vue/component-name-in-template-casingenforce specific casing for the component naming style in templateπŸ”§πŸ”¨
vue/component-options-name-casingenforce the casing of component name in components optionsπŸ”§πŸ’‘πŸ”¨
vue/custom-event-name-casingenforce specific casing for custom event nameπŸ”¨
vue/define-emits-declarationenforce declaration style of defineEmitsπŸ”¨
vue/define-macros-orderenforce order of compiler macros (defineProps, defineEmits, etc.)πŸ”§πŸ’‘πŸ’„
vue/define-props-declarationenforce declaration style of definePropsπŸ”¨
vue/define-props-destructuringenforce consistent style for props destructuringπŸ”¨
vue/enforce-style-attributeenforce or forbid the use of the scoped and module attributes in SFC top level style tagsπŸ”¨
vue/html-button-has-typedisallow usage of button without an explicit type attributeπŸ”¨
vue/html-comment-content-newlineenforce unified line break in HTML commentsπŸ”§πŸ’„
vue/html-comment-content-spacingenforce unified spacing in HTML commentsπŸ”§πŸ’„
vue/html-comment-indentenforce consistent indentation in HTML commentsπŸ”§πŸ’„
vue/match-component-file-namerequire component name property to match its file nameπŸ’‘πŸ”¨
vue/match-component-import-namerequire the registered component name to match the imported component name⚠️
vue/max-lines-per-blockenforce maximum number of lines in Vue SFC blocks⚠️
vue/max-propsenforce maximum number of props in Vue component⚠️
vue/max-template-depthenforce maximum depth of template⚠️
vue/new-line-between-multi-line-propertyenforce new lines between multi-line properties in Vue componentsπŸ”§πŸ’„
vue/next-tick-styleenforce Promise or callback style in nextTickπŸ”§πŸ”¨
vue/no-bare-strings-in-templatedisallow the use of bare strings in <template>πŸ”¨
vue/no-boolean-defaultdisallow boolean defaultsπŸ”¨
vue/no-duplicate-attr-inheritanceenforce inheritAttrs to be set to false when using v-bind="$attrs"πŸ”¨
vue/no-duplicate-class-namesdisallow duplication of class names in class attributesπŸ”§πŸ”¨
vue/no-empty-component-blockdisallow the <template> <script> <style> block to be emptyπŸ”§πŸ”¨
vue/no-import-compiler-macrosdisallow importing Vue compiler macrosπŸ”§βš οΈ
vue/no-multiple-objects-in-classdisallow passing multiple objects in an array to classπŸ”¨
vue/no-negated-v-if-conditiondisallow negated conditions in v-if/v-elseπŸ’‘πŸ”¨
vue/no-potential-component-option-typodisallow a potential typo in your component propertyπŸ’‘πŸ”¨
vue/no-ref-object-reactivity-lossdisallow usages of ref objects that can lead to loss of reactivity⚠️
vue/no-restricted-blockdisallow specific blockπŸ”¨
vue/no-restricted-call-after-awaitdisallow asynchronously called restricted methodsπŸ”¨
vue/no-restricted-classdisallow specific classes in Vue components⚠️
vue/no-restricted-component-namesdisallow specific component namesπŸ’‘πŸ”¨
vue/no-restricted-component-optionsdisallow specific component optionπŸ”¨
vue/no-restricted-custom-eventdisallow specific custom eventπŸ’‘πŸ”¨
vue/no-restricted-html-elementsdisallow specific elementsπŸ”¨
vue/no-restricted-propsdisallow specific propsπŸ’‘πŸ”¨
vue/no-restricted-static-attributedisallow specific attributeπŸ”¨
vue/no-restricted-v-binddisallow specific argument in v-bindπŸ”¨
vue/no-restricted-v-ondisallow specific argument in v-onπŸ”¨
vue/no-root-v-ifdisallow v-if directives on root elementπŸ”¨
vue/no-setup-props-reactivity-lossdisallow usages that lose the reactivity of props passed to setupπŸ”¨
vue/no-static-inline-stylesdisallow static inline style attributesπŸ”¨
vue/no-template-target-blankdisallow target="_blank" attribute without rel="noopener noreferrer"πŸ’‘βš οΈ
vue/no-this-in-before-route-enterdisallow this usage in a beforeRouteEnter method⚠️
vue/no-undef-componentsdisallow use of undefined components in <template>πŸ”¨
vue/no-undef-propertiesdisallow undefined propertiesπŸ”¨
vue/no-unsupported-featuresdisallow unsupported Vue.js syntax on the specified versionπŸ”§πŸ”¨
vue/no-unused-emit-declarationsdisallow unused emit declarationsπŸ”¨
vue/no-unused-propertiesdisallow unused propertiesπŸ”¨
vue/no-unused-refsdisallow unused refsπŸ”¨
vue/no-use-v-else-with-v-fordisallow using v-else-if/v-else on the same element as v-forπŸ”¨
vue/no-useless-mustachesdisallow unnecessary mustache interpolationsπŸ”§πŸ”¨
vue/no-useless-v-binddisallow unnecessary v-bind directivesπŸ”§πŸ”¨
vue/no-v-textdisallow use of v-textπŸ”¨
vue/padding-line-between-blocksrequire or disallow padding lines between blocksπŸ”§πŸ’„
vue/padding-line-between-tagsrequire or disallow newlines between sibling tags in templateπŸ”§πŸ’„
vue/padding-lines-in-component-definitionrequire or disallow padding lines in component definitionπŸ”§πŸ’„
vue/prefer-define-optionsenforce use of defineOptions instead of default exportπŸ”§πŸ”¨
vue/prefer-prop-type-boolean-firstenforce Boolean comes first in component prop typesπŸ’‘βš οΈ
vue/prefer-separate-static-classrequire static class names in template to be in a separate class attributeπŸ”§πŸ”¨
vue/prefer-true-attribute-shorthandrequire shorthand form attribute when v-bind value is trueπŸ’‘πŸ”¨
vue/prefer-use-template-refrequire using useTemplateRef instead of ref/shallowRef for template refsπŸ”¨
vue/require-default-exportrequire components to be the default export⚠️
vue/require-direct-exportrequire the component to be directly exportedπŸ”¨
vue/require-emit-validatorrequire type definitions in emitsπŸ’‘πŸ”¨
vue/require-explicit-slotsrequire slots to be explicitly defined⚠️
vue/require-exposerequire declare public properties using exposeπŸ’‘πŸ”¨
vue/require-macro-variable-namerequire a certain macro variable nameπŸ’‘πŸ”¨
vue/require-name-propertyrequire a name property in Vue componentsπŸ’‘πŸ”¨
vue/require-prop-commentrequire props to have a commentπŸ”¨
vue/require-typed-object-propenforce adding type declarations to object propsπŸ’‘πŸ”¨
vue/require-typed-refrequire ref and shallowRef functions to be strongly typedπŸ”¨
vue/restricted-component-namesenforce using only specific component names⚠️
vue/script-indentenforce consistent indentation in <script>πŸ”§πŸ’„
vue/slot-name-casingenforce specific casing for slot namesπŸ”¨
vue/sort-keysenforce sort-keys in a manner that is compatible with order-in-componentsπŸ”¨
vue/static-class-names-orderenforce static class names orderπŸ”§πŸ”¨
vue/v-for-delimiter-styleenforce v-for directive's delimiter styleπŸ”§πŸ’„
vue/v-if-else-keyrequire key attribute for conditionally rendered repeated componentsπŸ”§βš οΈ
vue/v-on-handler-styleenforce writing style for handlers in v-on directivesπŸ”§πŸ”¨

Extension Rules ​

The following rules extend the rules provided by ESLint itself and apply them to the expressions in the <template>.

Rule IDDescription
vue/array-bracket-newlineEnforce linebreaks after opening and before closing array brackets in <template>πŸ”§πŸ’„
vue/array-bracket-spacingEnforce consistent spacing inside array brackets in <template>πŸ”§πŸ’„
vue/array-element-newlineEnforce line breaks after each array element in <template>πŸ”§πŸ’„
vue/arrow-spacingEnforce consistent spacing before and after the arrow in arrow functions in <template>πŸ”§πŸ’„
vue/block-spacingDisallow or enforce spaces inside of blocks after opening block and before closing block in <template>πŸ”§πŸ’„
vue/brace-styleEnforce consistent brace style for blocks in <template>πŸ”§πŸ’„
vue/camelcaseEnforce camelcase naming convention in <template>πŸ”¨
vue/comma-dangleRequire or disallow trailing commas in <template>πŸ”§πŸ’„
vue/comma-spacingEnforce consistent spacing before and after commas in <template>πŸ”§πŸ’„
vue/comma-styleEnforce consistent comma style in <template>πŸ”§πŸ’„
vue/dot-locationEnforce consistent newlines before and after dots in <template>πŸ”§πŸ’„
vue/dot-notationEnforce dot notation whenever possible in <template>πŸ”§πŸ”¨
vue/eqeqeqRequire the use of === and !== in <template>πŸ”§πŸ’‘πŸ”¨
vue/func-call-spacingRequire or disallow spacing between function identifiers and their invocations in <template>πŸ”§πŸ’„
vue/key-spacingEnforce consistent spacing between keys and values in object literal properties in <template>πŸ”§πŸ’„
vue/keyword-spacingEnforce consistent spacing before and after keywords in <template>πŸ”§πŸ’„
vue/max-lenenforce a maximum line length in .vue filesπŸ’„
vue/multiline-ternaryEnforce newlines between operands of ternary expressions in <template>πŸ”§πŸ’„
vue/no-consoleDisallow the use of console in <template>πŸ’‘πŸ”¨
vue/no-constant-conditionDisallow constant expressions in conditions in <template>⚠️
vue/no-empty-patternDisallow empty destructuring patterns in <template>⚠️
vue/no-extra-parensDisallow unnecessary parentheses in <template>πŸ”§πŸ’„
vue/no-implicit-coercionDisallow shorthand type conversions in <template>πŸ”§πŸ’‘πŸ”¨
vue/no-irregular-whitespacedisallow irregular whitespace in .vue files⚠️
vue/no-loss-of-precisionDisallow literal numbers that lose precision in <template>⚠️
vue/no-negated-conditionDisallow negated conditions in <template>πŸ”¨
vue/no-restricted-syntaxDisallow specified syntax in <template>πŸ”¨
vue/no-sparse-arraysDisallow sparse arrays in <template>⚠️
vue/no-useless-concatDisallow unnecessary concatenation of literals or template literals in <template>πŸ”¨
vue/object-curly-newlineEnforce consistent line breaks after opening and before closing braces in <template>πŸ”§πŸ’„
vue/object-curly-spacingEnforce consistent spacing inside braces in <template>πŸ”§πŸ’„
vue/object-property-newlineEnforce placing object properties on separate lines in <template>πŸ”§πŸ’„
vue/object-shorthandRequire or disallow method and property shorthand syntax for object literals in <template>πŸ”§πŸ”¨
vue/operator-linebreakEnforce consistent linebreak style for operators in <template>πŸ”§πŸ’„
vue/prefer-templateRequire template literals instead of string concatenation in <template>πŸ”§πŸ”¨
vue/quote-propsRequire quotes around object literal property names in <template>πŸ”§πŸ”¨
vue/space-in-parensEnforce consistent spacing inside parentheses in <template>πŸ”§πŸ’„
vue/space-infix-opsRequire spacing around infix operators in <template>πŸ”§πŸ’„
vue/space-unary-opsEnforce consistent spacing before or after unary operators in <template>πŸ”§πŸ’„
vue/template-curly-spacingRequire or disallow spacing around embedded expressions of template strings in <template>πŸ”§πŸ’„

Deprecated ​

  • 🚫 We're going to remove deprecated rules in the next major release. Please migrate to successor/new rules.
  • πŸ˜‡ We don't fix bugs which are in deprecated rules since we don't have enough resources.
Rule IDReplaced by
vue/no-v-for-template-key(no replacement)
vue/no-v-model-argument(no replacement)
vue/valid-model-definition(no replacement)
vue/valid-v-bind-sync(no replacement)

Removed ​

  • β›” These rules have been removed in a previous major release, after they have been deprecated for a while.
Rule IDReplaced byDeprecated in versionRemoved in version
vue/component-tags-ordervue/block-orderv9.16.0v10.0.0
vue/experimental-script-setup-vars(no replacement)v7.13.0v9.0.0
vue/name-property-casingvue/component-definition-name-casingv7.0.0v9.0.0
vue/no-confusing-v-for-v-ifvue/no-use-v-if-with-v-forv5.0.0v9.0.0
vue/no-invalid-model-keysvue/valid-model-definitionv9.0.0v10.0.0
vue/no-ref-object-destructurevue/no-ref-object-reactivity-lossv9.17.0v10.0.0
vue/no-setup-props-destructurevue/no-setup-props-reactivity-lossv9.17.0v10.0.0
vue/no-unregistered-componentsvue/no-undef-componentsv8.4.0v9.0.0
vue/script-setup-uses-vars(no replacement)v9.0.0v10.0.0
vue/v-on-function-callvue/v-on-handler-stylev9.7.0v10.0.0