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下方