An eslint configuration for vue

Shared ESLint config for Vue 3 + TypeScript projects. Ships as a flat config array and supports ESLint 9 and 10.

Version 2.x requires ESLint >= 9 (flat config). For legacy .eslintrc projects on ESLint 8, stay on version 1.x.

This single package includes everything a Vue project needs — eslint:recommended, typescript-eslint recommended, eslint-plugin-vue strongly-recommended, @vue/eslint-config-typescript and @voicenter-team/eslint-config-ts — so nothing else has to be added.

Usage

1. Install dependencies

   npm i eslint @voicenter-team/eslint-config-vue --save-dev

2. Create eslint.config.mjs in the project root:

   import voicenterVue from '@voicenter-team/eslint-config-vue'
   
   export default [
       ...voicenterVue,
       // project-specific overrides go here
   ]

   or CommonJS (eslint.config.js):

   const voicenterVue = require('@voicenter-team/eslint-config-vue')
   
   module.exports = [
       ...voicenterVue
   ]

Migrating from 1.x

The old .eslintrc setup:

{
    "extends": [
        "plugin:@typescript-eslint/recommended",
        "plugin:vue/vue3-strongly-recommended",
        "@vue/typescript/recommended",
        "eslint:recommended",
        "@voicenter-team/vue"
    ]
}

becomes just the eslint.config.mjs shown above — all of those presets are already composed into this package.

All custom rules and options are preserved. What changed under the hood:

| 1.x (eslintrc) | 2.x (flat config) | | --- | --- | | plugin:vue/vue3-strongly-recommended | eslint-plugin-vue v10 flat/strongly-recommended | | @vue/typescript/recommended | @vue/eslint-config-typescript v14 (defineConfigWithVueTs) | | vue/component-tags-order | vue/block-order (rule was renamed in eslint-plugin-vue v10; same template → script → style order) | | env: { 'vue/setup-compiler-macros': true } | compiler macro globals baked in (now also covers defineModel, defineOptions, defineSlots) | | @voicenter-team/eslint-config-ts 1.x | 2.x — see its migration notes |

Things to check in consuming projects:

• Inline disable comments for formatting rules need the new prefix: // eslint-disable-next-line semi becomes // eslint-disable-next-line @stylistic/semi. vue/* and @typescript-eslint/* rule names are unchanged, except vue/component-tags-order → vue/block-order.
• <script> blocks may use ts, tsx, js or jsx, same as 1.x. To restrict to TypeScript only, the consuming project can add a vue/block-lang override.
• Remove --ext flags from lint scripts — flat config handles file matching itself.