@voicenter-team/eslint-config-vue

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.

Versions 2.x and 3.x require 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
   ]
   

Strict TypeScript rules

In script code, @voicenter-team/eslint-config-ts bans type assertions (x as Foo, <Foo>x), non-null assertions (x!), // @ts-ignore, // @ts-expect-error and // @ts-nocheck comments, and explicit any; as const and // @ts-check are allowed. Its README lists the rules and what replaces each construct: unknown instead of any, type guards, explicit checks, generics, annotations and satisfies.

Those rules see script code only. In <template> expressions, vue/no-restricted-syntax bans the same syntax: TSAsExpression, TSTypeAssertion and TSNonNullExpression. In a template every as is reported, as const included. A value the template needs narrowed is narrowed by a v-if with a type guard, or in the script, for example in a computed.

Migrating from 2.x

3.x depends on @voicenter-team/eslint-config-ts 3.x and completes the strict TypeScript rules: it bans type assertions and non-null assertions in script code and in templates, and // @ts-expect-error comments with a description, which 2.x allowed. // @ts-ignore, // @ts-nocheck and explicit any were already errors in 2.x. Every other rule and option is unchanged. A project that upgrades fails lint at each newly banned construct it uses.

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:

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.