eslint prettier husky 在 vue3 + typescript +vite 中的最佳配置

项目采用 vue3 + typescript + vite，所以需要自己配置 eslint、prettier、husky。

Eslint Prettier

安装

eslint

yarn add eslint --dev

eslint 插件

yarn add eslint-plugin-vue @typescript-eslint/eslint-plugin eslint-plugin-prettier --dev

typescript parser

yarn add @typescript-eslint/parser --dev

prettier

yarn add prettier -D

解决 eslint 和 prettier 冲突

yarn add eslint-config-prettier --dev

.eslintrc.js 配置

root

默认情况下，ESLint 会在所有父级目录里寻找配置文件，一直到根目录。为了将 ESLint 限制到一个特定的项目，在项目根目录下的 package.json 或 .eslintrc.* 里设置 "root": true。ESLint 一旦发现配置文件中有 "root": true，就会停止在父级目录中寻找。

env

运行环境配置。

1. browser: true,
2. node: true,
3. es2021: true // 启用2021中的全局变量

parse

指定eslint解析器。默认使用Espree

由于 Vue 中的单文件组件不是纯 JavaScript，所以不能使用默认解析器，需要引入vue-eslint-parser解析器生成增强的 AST。这个解析器可以对vue文件的