ESLint Shareable Configs for JavaScript Standard Style in Vue.js + TypeScript Projects

This config is specifically designed to be used by create-vue setups and is not meant for outside use (it can be used but some adaptations on the user side might be needed - for details see the config file).

A part of its design is that this config may implicitly depend on other parts of create-vue setups, such as eslint-plugin-vue being extended in the same resulting config.

Please use this package alongside @vue/eslint-config-typescript.

To use eslint.config.ts as the configuration file, you also need to install jiti.

npm add --dev jiti @vue/eslint-config-typescript @vue/eslint-config-standard-with-typescript

An example eslint.config.ts:

import pluginVue from 'eslint-plugin-vue'
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
import standard from '@vue/eslint-config-standard-with-typescript'

export default defineConfigWithVueTs(
  pluginVue.configs['flat/essential'],
  vueTsConfigs.recommended,
  vueTsConfigs.stylistic,
  standard,
)

If you need more comprehensive linting rules, including those that require type information, you can use the recommendedTypeChecked config:

import pluginVue from 'eslint-plugin-vue'
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
import { standardTypeChecked } from '@vue/eslint-config-standard-with-typescript'

export default defineConfigWithVueTs(
  pluginVue.configs['flat/essential'],
  vueTsConfigs.recommendedTypeChecked,
  vueTsConfigs.stylisticTypeChecked,
  standardTypeChecked
)

This ruleset automatically reads the TypeScript path mappings from **/tsconfig.json and **/tsconfig.*.json files in the project. You don't need any additional configuration to set up aliases.