vue3项目中eslint.config.ts配置rules

vue3项目中eslint.config.ts配置rules

1. 使用npm create vue@latest创建vue项目

默认的eslint.config.ts如下

import { globalIgnores } from 'eslint/config'
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
import pluginVue from 'eslint-plugin-vue'
import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'// To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
// import { configureVueProject } from '@vue/eslint-config-typescript'
// configureVueProject({ scriptLangs: ['ts', 'tsx'] })
// More info at https://github.com/vuejs/eslint-config-typescript/#advanced-setupexport default defineConfigWithVueTs({name: 'app/files-to-lint',files: ['**/*.{ts,mts,tsx,vue}'],},globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']),pluginVue.configs['flat/essential'],vueTsConfigs.recommended,skipFormatting,
)

2. 配置rules

之前我一直在第一个对象中写rules，一直不生效，最后发现要新增一个对象写rules，并且要放在vueTsConfigs.recommended下方，代码如下：

import { globalIgnores } from 'eslint/config'
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
import pluginVue from 'eslint-plugin-vue'
import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'// To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
// import { configureVueProject } from '@vue/eslint-config-typescript'
// configureVueProject({ scriptLangs: ['ts', 'tsx'] })
// More info at https://github.com/vuejs/eslint-config-typescript/#advanced-setupexport default defineConfigWithVueTs({name: 'app/files-to-lint',files: ['**/*.{ts,mts,tsx,vue}'],},globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']),pluginVue.configs['flat/essential'],vueTsConfigs.recommended,{rules: {'vue/multi-word-component-names': 'off','@typescript-eslint/no-explicit-any': 'off',},},skipFormatting,
)

注意：一定要放在vueTsConfigs.recommended下方