Logo
  • DB
  • About
  • Updates
eslint-plugin-vue

Official ESLint plugin for Vue.js

❯ npm i --save-dev eslint-plugin-vue
🏠 Homepage🐛 BugsGitHub LogoGitHubnpm Logonpmvue
🕵️‍♂️ Linter
  • 8 Configs
  • 236 Rules
  • 1 Processor
GitHub LogoGitHub
  • JavaScript
  • 4.3K Stars
  • 56 Watchers
npm Logonpm
  • 1.5M Wkly Downloads
  • +24% WoW
  • 9.19.2 1.28 MB
📋 Requirements
  • Node: ^14.17 || >=16
  • ESLint: ^6.2 || ^7 || ^8
🗂️ Keywords
  • html
  • javascript
  • npm
  • npm-module
  • npm-package
  • ...
ConfigurationRules
🔴 base2
🟠 essential58
🟡 no-layout-rules47 off
recommended7 warn
🟢 strongly-recommended23 warn
🔵 vue3-essential80
🟣 vue3-recommended7 warn
🟤 vue3-strongly-recommended25 warn
RuleDescription🔧💡💭🗂️⚙️🔴🟠🟡🟢🔵🟣🟤
array-bracket-newline

enforce linebreaks after opening and before closing array brackets in <template>

🔧⚙️🚫
array-bracket-spacing

enforce consistent spacing inside array brackets in <template>

🔧⚙️🚫
array-element-newline

enforce line breaks after each array element in <template>

🔧⚙️🚫
arrow-spacing

enforce consistent spacing before and after the arrow in arrow functions in <template>

🔧⚙️🚫
attribute-hyphenation

enforce attribute naming style on custom components in template

🔧📖⚙️⚠️⚠️
attributes-order

enforce order of attributes

🔧📖⚙️⚠️⚠️
block-lang

disallow use other than available lang

📖⚙️
block-order

enforce order of component top-level elements

🔧📖⚙️
block-spacing

disallow or enforce spaces inside of blocks after opening block and before closing block in <template>

🔧🚫
block-tag-newline

enforce line breaks after opening and before closing block-level tags

🔧📏⚙️🚫
brace-style

enforce consistent brace style for blocks in <template>

🔧⚙️🚫
camelcase

enforce camelcase naming convention in <template>

⚙️
comma-dangle

require or disallow trailing commas in <template>

🔧⚙️🚫
comma-spacing

enforce consistent spacing before and after commas in <template>

🔧⚙️🚫
comma-style

enforce consistent comma style in <template>

🔧⚙️🚫
comment-directive

support comment-directives in <template>

⚙️🔴
component-api-style

enforce component API style

📖
component-definition-name-casing

enforce specific casing for component definition name

🔧📖⚠️⚠️
component-name-in-template-casing

enforce specific casing for the component naming style in template

🔧📖⚙️
component-options-name-casing

enforce the casing of component name in components options

🔧💡📖
component-tags-order

enforce order of component top-level elements

🔧📖⚙️⚠️⚠️
custom-event-name-casing

enforce specific casing for custom event name

📖⚙️
define-emits-declaration

enforce declaration style of defineEmits

📖
define-macros-order

enforce order of defineEmits and defineProps compiler macros

🔧📏⚙️🚫
define-props-declaration

enforce declaration style of defineProps

📖
dot-location

enforce consistent newlines before and after dots in <template>

🔧🚫
dot-notation

enforce dot notation whenever possible in <template>

🔧⚙️
eqeqeq

require the use of === and !== in <template>

🔧⚙️
first-attribute-linebreak

enforce the location of first attribute

🔧📏⚙️🚫⚠️⚠️
func-call-spacing

require or disallow spacing between function identifiers and their invocations in <template>

🔧⚙️🚫
html-button-has-type

disallow usage of button without an explicit type attribute

📖⚙️
html-closing-bracket-newline

require or disallow a line break before tag's closing brackets

🔧📏⚙️🚫⚠️⚠️
html-closing-bracket-spacing

require or disallow a space before tag's closing brackets

🔧📏⚙️🚫⚠️⚠️
html-comment-content-newline

enforce unified line brake in HTML comments

🔧📏⚙️🚫
html-comment-content-spacing

enforce unified spacing in HTML comments

🔧📏⚙️🚫
html-comment-indent

enforce consistent indentation in HTML comments

🔧📏🚫
html-end-tags

enforce end tag style

🔧📖⚠️⚠️
html-indent

enforce consistent indentation in <template>

🔧📏⚙️🚫⚠️⚠️
html-quotes

enforce quotes style of HTML attributes

🔧📏⚙️🚫⚠️⚠️
html-self-closing

enforce self-closing style

🔧📏⚙️🚫⚠️⚠️
jsx-uses-vars

prevent variables used in JSX to be marked as unused

🔴
key-spacing

enforce consistent spacing between keys and values in object literal properties in <template>

🔧⚙️🚫
keyword-spacing

enforce consistent spacing before and after keywords in <template>

🔧⚙️🚫
match-component-file-name

require component name property to match its file name

💡📖⚙️
match-component-import-name

require the registered component name to match the imported component name

max-attributes-per-line

enforce the maximum number of attributes per line

🔧📏⚙️🚫⚠️⚠️
max-len

enforce a maximum line length in .vue files

📏⚙️🚫
max-lines-per-block

enforce maximum number of lines in Vue SFC blocks

⚙️
multi-word-component-names

require component names to be always multi-word

📖⚙️🟠🔵
multiline-html-element-content-newline

require a line break before and after the contents of a multiline element

🔧📏⚙️🚫⚠️⚠️
multiline-ternary

enforce newlines between operands of ternary expressions in <template>

🚫
mustache-interpolation-spacing

enforce unified spacing in mustache interpolations

🔧📏🚫⚠️⚠️
new-line-between-multi-line-property

enforce new lines between multi-line properties in Vue components

🔧📏⚙️🚫
next-tick-style

enforce Promise or callback style in nextTick

🔧📖
no-arrow-functions-in-watch

disallow using arrow functions to define watcher

🟠🔵
no-async-in-computed-properties

disallow asynchronous actions in computed properties

🟠🔵
no-bare-strings-in-template

disallow the use of bare strings in <template>

📖⚙️
no-boolean-default

disallow boolean defaults

🔧📖
no-child-content

disallow element's child contents which would be overwritten by a directive like v-html or v-text

💡⚙️🟠🔵
no-computed-properties-in-data

disallow accessing computed properties in data.

🟠🔵
no-console

disallow the use of console in <template>

⚙️
no-constant-condition

disallow constant expressions in conditions in <template>

⚙️
no-custom-modifiers-on-v-model

disallow custom modifiers on v-model used on the component

🟠
no-deprecated-data-object-declaration

disallow using deprecated object declaration on data (in Vue.js 3.0.0+)

🔧🔵
no-deprecated-destroyed-lifecycle

disallow using deprecated destroyed and beforeDestroy lifecycle hooks (in Vue.js 3.0.0+)

🔧🔵
no-deprecated-dollar-listeners-api

disallow using deprecated $listeners (in Vue.js 3.0.0+)

🔵
no-deprecated-dollar-scopedslots-api

disallow using deprecated $scopedSlots (in Vue.js 3.0.0+)

🔧🔵
no-deprecated-events-api

disallow using deprecated events api (in Vue.js 3.0.0+)

🔵
no-deprecated-filter

disallow using deprecated filters syntax (in Vue.js 3.0.0+)

🔵
no-deprecated-functional-template

disallow using deprecated the functional template (in Vue.js 3.0.0+)

🔵
no-deprecated-html-element-is

disallow using deprecated the is attribute on HTML elements (in Vue.js 3.0.0+)

🔵
no-deprecated-inline-template

disallow using deprecated inline-template attribute (in Vue.js 3.0.0+)

🔵
no-deprecated-model-definition

disallow deprecated model definition (in Vue.js 3.0.0+)

💡⚙️
no-deprecated-props-default-this

disallow deprecated this access in props default function (in Vue.js 3.0.0+)

🔵
no-deprecated-router-link-tag-prop

disallow using deprecated tag property on RouterLink (in Vue.js 3.0.0+)

⚙️🔵
no-deprecated-scope-attribute

disallow deprecated scope attribute (in Vue.js 2.5.0+)

🔧📖🔵
no-deprecated-slot-attribute

disallow deprecated slot attribute (in Vue.js 2.6.0+)

🔧📖🔵
no-deprecated-slot-scope-attribute

disallow deprecated slot-scope attribute (in Vue.js 2.6.0+)

🔧📖🔵
no-deprecated-v-bind-sync

disallow use of deprecated .sync modifier on v-bind directive (in Vue.js 3.0.0+)

🔧🔵
no-deprecated-v-is

disallow deprecated v-is directive (in Vue.js 3.1.0+)

🔧📖🔵
no-deprecated-v-on-native-modifier

disallow using deprecated .native modifiers (in Vue.js 3.0.0+)

🔵
no-deprecated-v-on-number-modifiers

disallow using deprecated number (keycode) modifiers (in Vue.js 3.0.0+)

🔧🔵
no-deprecated-vue-config-keycodes

disallow using deprecated Vue.config.keyCodes (in Vue.js 3.0.0+)

🔵
no-dupe-keys

disallow duplication of field names

⚙️🟠🔵
no-dupe-v-else-if

disallow duplicate conditions in v-if / v-else-if chains

🟠🔵
no-duplicate-attr-inheritance

enforce inheritAttrs to be set to false when using v-bind="$attrs"

📖
no-duplicate-attributes

disallow duplication of attributes

⚙️🟠🔵
no-empty-component-block

disallow the <template> <script> <style> block to be empty

📖
no-empty-pattern

disallow empty destructuring patterns in <template>

no-export-in-script-setup

disallow export in <script setup>

🟠🔵
no-expose-after-await

disallow asynchronously registered expose

🔵
no-extra-parens

disallow unnecessary parentheses in <template>

🔧⚙️🚫
no-invalid-model-keys

require valid keys in model option

no-irregular-whitespace

disallow irregular whitespace in .vue files

⚙️
no-lifecycle-after-await

disallow asynchronously registered lifecycle hooks

📖🔵
no-lone-template

disallow unnecessary <template>

⚙️⚠️⚠️
no-loss-of-precision
no-multi-spaces

disallow multiple spaces

🔧📏⚙️🚫⚠️⚠️
no-multiple-objects-in-class

disallow to pass multiple objects into array to class

📖
no-multiple-slot-args

disallow to pass multiple arguments to scoped slots

⚠️⚠️
no-multiple-template-root

disallow adding multiple root nodes to the template

🟠
no-mutating-props

disallow mutation of component props

📖⚙️🟠🔵
no-parsing-error

disallow parsing errors in <template>

⚙️🟠🔵
no-potential-component-option-typo

disallow a potential typo in your component property

💡📖⚙️
no-ref-as-operand

disallow use of value wrapped by ref() (Composition API) as an operand

🔧📖🟠🔵
no-ref-object-destructure

disallow usages of ref objects that can lead to loss of reactivity

no-ref-object-reactivity-loss

disallow usages of ref objects that can lead to loss of reactivity

no-required-prop-with-default

enforce props with default values to be optional

🔧💡⚙️
no-reserved-component-names

disallow the use of reserved names in component definitions

📖⚙️🟠🔵
no-reserved-keys

disallow overwriting reserved keys

📖⚙️🟠🔵
no-reserved-props

disallow reserved names in props

⚙️🟠🔵
no-restricted-block

disallow specific block

📖⚙️
no-restricted-call-after-await

disallow asynchronously called restricted methods

📖⚙️
no-restricted-class

disallow specific classes in Vue components

no-restricted-component-names

disallow specific component names

💡📖⚙️
no-restricted-component-options

disallow specific component option

📖⚙️
no-restricted-custom-event

disallow specific custom event

💡📖⚙️
no-restricted-html-elements

disallow specific HTML elements

📖⚙️
no-restricted-props

disallow specific props

💡📖⚙️
no-restricted-static-attribute

disallow specific attribute

📖⚙️
no-restricted-syntax

disallow specified syntax in <template>

⚙️
no-restricted-v-bind

disallow specific argument in v-bind

📖⚙️
no-root-v-if

disallow v-if directives on root element

📖
no-setup-props-destructure

disallow usages that lose the reactivity of props passed to setup

📖
no-setup-props-reactivity-loss

disallow usages that lose the reactivity of props passed to setup

📖
no-shared-component-data

enforce component's data property to be a function

🔧🟠🔵
no-side-effects-in-computed-properties

disallow side effects in computed properties

🟠🔵
no-spaces-around-equal-signs-in-attribute

disallow spaces around equal signs in attribute

🔧📏🚫⚠️⚠️
no-sparse-arrays

disallow sparse arrays in <template>

no-static-inline-styles

disallow static inline style attributes

📖⚙️
no-template-key

disallow key attribute on <template>

🟠🔵
no-template-shadow

disallow variable declarations from shadowing variables declared in the outer scope

📖⚠️⚠️
no-template-target-blank

disallow target="_blank" attribute without rel="noopener noreferrer"

💡⚙️
no-textarea-mustache

disallow mustaches in <textarea>

🟠🔵
no-this-in-before-route-enter

disallow this usage in a beforeRouteEnter method

no-undef-components

disallow use of undefined components in <template>

📖⚙️
no-undef-properties

disallow undefined properties

📖⚙️
no-unsupported-features

disallow unsupported Vue.js syntax on the specified version

🔧📖⚙️
no-unused-components

disallow registering components that are not used inside templates

📖⚙️🟠🔵
no-unused-properties

disallow unused properties

📖⚙️
no-unused-refs

disallow unused refs

📖
no-unused-vars

disallow unused variable definitions of v-for directives or scope attributes

💡📖⚙️🟠🔵
no-use-computed-property-like-method

disallow use computed property like method

🟠🔵
no-use-v-else-with-v-for

disallow using v-else-if/v-else on the same element as v-for

📖
no-use-v-if-with-v-for

disallow using v-if on the same element as v-for

📖⚙️🟠🔵
no-useless-concat

disallow unnecessary concatenation of literals or template literals in <template>

no-useless-mustaches

disallow unnecessary mustache interpolations

🔧📖⚙️
no-useless-template-attributes

disallow useless attribute on <template>

🟠🔵
no-useless-v-bind

disallow unnecessary v-bind directives

🔧📖⚙️
no-v-for-template-key

disallow key attribute on <template v-for>

🟠
no-v-for-template-key-on-child

disallow key of <template v-for> placed on child elements

🔵
no-v-html

disallow use of v-html to prevent XSS attack

📖⚠️⚠️
no-v-model-argument

disallow adding an argument to v-model used in custom component

🟠
no-v-text

disallow use of v-text

📖
no-v-text-v-html-on-component

disallow v-text / v-html on component

🟠🔵
no-watch-after-await

disallow asynchronously registered watch

📖🔵
object-curly-newline

enforce consistent line breaks inside braces in <template>

🔧⚙️🚫
object-curly-spacing

enforce consistent spacing inside braces in <template>

🔧⚙️🚫
object-property-newline

enforce placing object properties on separate lines in <template>

🔧⚙️🚫
object-shorthand

require or disallow method and property shorthand syntax for object literals in <template>

🔧⚙️
one-component-per-file

enforce that each component should be in its own file

📖⚠️⚠️
operator-linebreak

enforce consistent linebreak style for operators in <template>

🔧⚙️🚫
order-in-components

enforce order of properties in components

🔧📖⚙️⚠️⚠️
padding-line-between-blocks

require or disallow padding lines between blocks

🔧📏🚫
padding-line-between-tags

require or disallow newlines between sibling tags in template

🔧📏⚙️🚫
padding-lines-in-component-definition

require or disallow padding lines in component definition

🔧📏⚙️🚫
prefer-define-options

enforce use of defineOptions instead of default export.

🔧📖
prefer-import-from-vue

enforce import from 'vue' instead of import from '@vue/*'

🔧📖🔵
prefer-prop-type-boolean-first

enforce Boolean comes first in component prop types

💡
prefer-separate-static-class

require static class names in template to be in a separate class attribute

🔧📖
prefer-template

require template literals instead of string concatenation in <template>

🔧
prefer-true-attribute-shorthand

require shorthand form attribute when v-bind value is true

💡📖
prop-name-casing

enforce specific casing for the Prop name in Vue components

📖⚠️⚠️
quote-props

require quotes around object literal property names in <template>

🔧⚙️
require-component-is

require v-bind:is of <component> elements

🟠🔵
require-default-prop

require default value for props

📖⚠️⚠️
require-direct-export

require the component to be directly exported

📖⚙️
require-emit-validator

require type definitions in emits

💡📖
require-explicit-emits

require emits option with name triggered by $emit()

💡📖⚙️⚠️
require-expose

require declare public properties using expose

💡📖
require-macro-variable-name

require a certain macro variable name

💡📖⚙️
require-name-property

require a name property in Vue components

💡📖
require-prop-comment

require props to have a comment

📖⚙️
require-prop-type-constructor

require prop type to be a constructor

🔧📖🟠🔵
require-prop-types

require type definitions in props

📖⚠️⚠️
require-render-return

enforce render function to always return value

🟠🔵
require-slots-as-functions

enforce properties of $slots to be used as a function

🔵
require-toggle-inside-transition

require control the display of the content inside <transition>

🔵
require-typed-object-prop

enforce adding type declarations to object props

💡📖
require-typed-ref

require ref and shallowRef functions to be strongly typed

📖
require-v-for-key

require v-bind:key with v-for directives

🟠🔵
require-valid-default-prop

enforce props default values to be valid

📖🟠🔵
return-in-computed-property

enforce that a return statement is present in computed property

⚙️🟠🔵
return-in-emits-validator

enforce that a return statement is present in emits validator

🟠🔵
script-indent

enforce consistent indentation in <script>

🔧📏⚙️🚫
script-setup-uses-vars

prevent <script setup> variables used in <template> to be marked as unused

singleline-html-element-content-newline

require a line break before and after the contents of a singleline element

🔧📏⚙️🚫⚠️⚠️
sort-keys

enforce sort-keys in a manner that is compatible with order-in-components

📖⚙️
space-in-parens

enforce consistent spacing inside parentheses in <template>

🔧⚙️🚫
space-infix-ops

require spacing around infix operators in <template>

🔧⚙️🚫
space-unary-ops

enforce consistent spacing before or after unary operators in <template>

🔧⚙️🚫
static-class-names-order

enforce static class names order

🔧📖
template-curly-spacing

require or disallow spacing around embedded expressions of template strings in <template>

🔧🚫
this-in-template

disallow usage of this in template

🔧📖⚠️⚠️
use-v-on-exact

enforce usage of exact modifier on v-on

📖🟠🔵
v-bind-style

enforce v-bind directive style

🔧📖⚠️⚠️
v-for-delimiter-style

enforce v-for directive's delimiter style

🔧📏🚫
v-on-event-hyphenation

enforce v-on event naming style on custom components in template

🔧📖⚙️⚠️
v-on-function-call

enforce or forbid parentheses after method calls without arguments in v-on directives

🔧📖⚙️
v-on-handler-style

enforce writing style for handlers in v-on directives

🔧📖⚙️
v-on-style

enforce v-on directive style

🔧📖⚠️⚠️
v-slot-style

enforce v-slot directive style

🔧📖⚙️⚠️⚠️
valid-attribute-name

require valid attribute names

🟠🔵
valid-define-emits

enforce valid defineEmits compiler macro

🟠🔵
valid-define-options

enforce valid defineOptions compiler macro

valid-define-props

enforce valid defineProps compiler macro

🟠🔵
valid-model-definition

require valid keys in model option

🟠
valid-next-tick

enforce valid nextTick function calls

🔧💡🟠🔵
valid-template-root

enforce valid template root

🟠🔵
valid-v-bind

enforce valid v-bind directives

🟠🔵
valid-v-bind-sync

enforce valid .sync modifier on v-bind directives

🟠
valid-v-cloak

enforce valid v-cloak directives

🟠🔵
valid-v-else

enforce valid v-else directives

🟠🔵
valid-v-else-if

enforce valid v-else-if directives

🟠🔵
valid-v-for

enforce valid v-for directives

🟠🔵
valid-v-html

enforce valid v-html directives

🟠🔵
valid-v-if

enforce valid v-if directives

🟠🔵
valid-v-is

enforce valid v-is directives

🔵
valid-v-memo

enforce valid v-memo directives

🔵
valid-v-model

enforce valid v-model directives

🟠🔵
valid-v-on

enforce valid v-on directives

⚙️🟠🔵
valid-v-once

enforce valid v-once directives

🟠🔵
valid-v-pre

enforce valid v-pre directives

🟠🔵
valid-v-show

enforce valid v-show directives

🟠🔵
valid-v-slot

enforce valid v-slot directives

⚙️🟠🔵
valid-v-text

enforce valid v-text directives

🟠🔵
© 2024 Lintbase