ESLint Configuration

17.1.1. Flat Config Usage

The Flat Config format (eslint.config.js) from ESLint v9 or later must be used. The legacy .eslintrc.* format must not be used.

---

17.1.2. Required Packages

yarn add -D eslint @eslint/js typescript-eslint eslint-plugin-vue eslint-config-prettier

Package	Role
eslint	Linter core
@eslint/js	ESLint base rules
typescript-eslint	TypeScript parser and rules
eslint-plugin-vue	Vue SFC lint rules
eslint-config-prettier	Prevents Prettier conflicts

---

17.1.3. Full eslint.config.js Example

import js from '@eslint/js'
import tseslint from 'typescript-eslint'
import pluginVue from 'eslint-plugin-vue'
import prettierConfig from 'eslint-config-prettier'

export default tseslint.config(
  {
    ignores: ['dist/', 'node_modules/', '*.config.js'],
  },

  js.configs.recommended,

  ...tseslint.configs.recommended,

  ...pluginVue.configs['flat/recommended'],

  {
    files: ['**/*.vue'],
    languageOptions: {
      parserOptions: {
        parser: tseslint.parser,
      },
    },
  },

  {
    rules: {
      // TypeScript
      '@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_' }],
      '@typescript-eslint/no-explicit-any': 'warn',
      '@typescript-eslint/consistent-type-imports': 'error',

      // Vue
      'vue/multi-word-component-names': 'off',
      'vue/define-macros-order': ['error', {
        order: ['defineProps', 'defineEmits'],
      }],
      'vue/block-order': ['error', {
        order: ['script', 'template', 'style'],
      }],
      'vue/component-api-style': ['error', ['script-setup']],

      // General
      'no-console': ['warn', { allow: ['warn', 'error'] }],
      'no-debugger': 'error',
    },
  },

  prettierConfig,
)

---

17.1.4. Key Rule Descriptions

Rule	Setting	Rationale
no-console	warn	Prevents console.log overuse. warn and error are allowed
no-debugger	error	Prevents leftover debugger statements
@typescript-eslint/no-explicit-any	warn	Minimizes any type usage
@typescript-eslint/consistent-type-imports	error	Enforces import type consistency
vue/component-api-style	error	Enforces <script setup> usage
vue/block-order	error	Unifies SFC block ordering