eslint-plugin-vuetify

2.7.2 verified Sat Apr 25 auth: no javascript

An ESLint plugin to help migrate between Vuetify major versions (v2→v3 and v3→v4). Current stable version is 2.7.2, released regularly with active development. Key differentiator: provides specific rules for deprecations and breaking changes in Vuetify, including recommended presets. Supports ESLint 8, 9, and 10 with both flat and legacy configs. Ships TypeScript types. Useful for projects using Vuetify 3 or 4, and for migrating from Vuetify 2.

Common errors

error Error: Failed to load plugin 'vuetify' declared in 'extends': Cannot find module 'eslint-plugin-vuetify' ↓

cause eslint-plugin-vuetify not installed or missing from node_modules.

fix

Run 'npm install eslint-plugin-vuetify --save-dev' or 'yarn add eslint-plugin-vuetify -D'.

error Error: Config (flat: 'flat/base') was not found in the plugin 'eslint-plugin-vuetify' ↓

cause Using incorrect config name for flat config; e.g., missing quotes or wrong key.

fix

Use vuetify.configs['flat/base'] with bracket notation and string quotes.

error Error: ESLint configuration in .eslintrc.js is invalid: extends property value 'plugin:vuetify/base' is not defined ↓

cause The plugin is not installed or the name is misspelled. Also, legacy config requires 'plugin:' prefix.

fix

Ensure 'eslint-plugin-vuetify' is installed and use 'plugin:vuetify/base' (note hyphen).

error ESLint couldn't find the config 'plugin:vuetify/recommended'. ↓

cause The 'recommended' config only exists for flat config, not legacy. Legacy users should use 'plugin:vuetify/base'.

fix

Use 'plugin:vuetify/base' for legacy .eslintrc.js, or switch to flat config and use 'flat/recommended'.

Warnings

breaking ESLint 10 only supports flat config format; legacy .eslintrc.js is not compatible. ↓

fix Switch to eslint.config.js flat config using 'flat/base' or 'flat/recommended' presets.

gotcha Does not affect pug templates due to vue-eslint-parser limitation. ↓

fix Convert pug templates to HTML or use a separate migration approach.

deprecated Vuetify v2 rules are not included in the latest plugin version; use eslint-plugin-vuetify@vuetify-2 for v1→v2 migrations. ↓

fix Install eslint-plugin-vuetify@vuetify-2 for Vuetify v2 migration rules.

gotcha When using flat config, you must spread vue plugin configs before vuetify configs for rules to work correctly. ↓

fix Ensure order: ...vue.configs['flat/base'] then ...vuetify.configs['flat/base'].

Install

npm install eslint-plugin-vuetify

yarn add eslint-plugin-vuetify

pnpm add eslint-plugin-vuetify

Imports

plugin object
wrong
```
const vuetify = require('eslint-plugin-vuetify')
```
correct
```
import vuetify from 'eslint-plugin-vuetify'
```
ESM is recommended; CommonJS require works but may cause issues with flat config usage.
base config (flat)
wrong
```
vuetify.configs.base
```
correct
```
vuetify.configs['flat/base']
```
For flat config (ESLint 9+), use 'flat/base' or 'flat/recommended'. Legacy configs are available under the root.
recommended-v4 config (flat)
wrong
```
vuetify.configs['recommended-v4']
```
correct
```
vuetify.configs['flat/recommended-v4']
```
v4 migration preset only available in flat config format since v2.6.0.
legacy config via extends
wrong
```
extends: ['vuetify/base']
```
correct
```
extends: ['plugin:vuetify/base']
```
Legacy .eslintrc.js format uses 'plugin:' prefix. For ESLint 8 only.

Quickstart

Set up eslint-plugin-vuetify with flat config (ESLint 9+) and enable all v4 migration rules.

// eslint.config.js
import vue from 'eslint-plugin-vue'
import vuetify from 'eslint-plugin-vuetify'

export default [
  ...vue.configs['flat/base'],
  ...vuetify.configs['flat/base'],
  {
    rules: {
      'vuetify/no-deprecated-typography': 'error',
      'vuetify/no-legacy-grid-props': 'error',
      'vuetify/no-elevation-overflow': 'error',
      'vuetify/no-deprecated-snackbar': 'error',
    }
  }
]