前言
大家好！我是 嘟老板。前段时间心血来潮，把 ZimuAdmin 的 ESLint 从 V8.41.0 升级到了 V9.8.0。特分享本次迁移过程，并汇总那些好用的 ESLint 插件。
阅读本文您将收获：
迁移过程
1. 升级依赖版本
- 将
eslint依赖版本升级到V9.x。
终端输入以下，重新安装最新依赖(第 2 点同理)：
pnpm remove eslint
pnpm add eslint@latest -D
- 将
eslint相关依赖升级到支持V9.x的版本，包括但不限于：
eslint-plugin-prettiereslint-plugin-vueeslint-plugin-n- ...
具体以项目依赖为准。本人使用的依赖在下面「依赖汇总」部分。
2. 修改 eslint 相关配置文件
.eslintrc.xxx
文件名变更
Eslint V9.x 版本前的配置文件命名通常为 .eslintrc.xxx，例如：
.eslintrc.js.eslintrc.cjs.eslintrc.json- ...
而 V9.x 版本设计了全新的配置系统，首先文件命名调整为 eslint.config.xxx，包括：
eslint.config.jseslint.config.mjseslint.config.cjs
快速迁移
ESLint 提供了配置迁移工具 - @eslint/migrate-config，可以帮助我们将现有配置快速迁移到 V9.x 版本。
终端输入以下命令，回车执行：
npx @eslint/migrate-config .eslintrc.json
该命令会解析 .eslintrc.xxx 配置文件，自动迁移并生成 eslint.config.js 配置文件。
目前该迁移工具更适用于如下 静态配置 文件：
.eslintrc.eslintrc.json.eslintrc.yml
对于 .eslintrc.js 等可能存在动态逻辑的配置文件，部分复杂的处理，如函数、计算等，可能会在迁移过程中丢失。
注意：
不保证工具迁移的Eslint配置可以完美运行，仍需要人工验证。
.eslintignore
不再支持 .eslintignore 文件配置，改用 eslint.config.js 中的 ignores 配置项。
export default [{
ignores: [
"**/node_modules/",
"**/.vscode/",
"**/.husky/",
// ...
],
}]
若使用了 @eslint/migrate-config 迁移工具，执行命令后，工具会自动在配置文件（.eslintrc.xxx）同目录下检索 .eslintignore，并将其内容迁移到新的配置文件（eslint.config.js）中。
3. 命令行调整
为方便快速格式化代码，通常会在 package.json 中添加 npm script，例如：
{
"scripts": {
"lint:fix": "eslint . --cache --ext .js,.ts,.jsx,.tsx,.vue --fix"
}
}
以上命令使用 --ext 标志，指定 ESLint 检查文件的扩展名.
然而 V9.x 版本不再支持 --ext 标志，需要改为在配置文件 eslint.config.js 中的 files 属性指定。
export default [{
files: [
'**/*.js',
'**/*.ts',
'**/*.jsx',
'**/*.tsx',
'**/*.vue'
]
}]
除 --ext 外，--rulesdir 和 --resolve-plugins-relative-to 标志也不再支持，若您有用到，可参考 迁移指南。
插件汇总
基础类
typescript-eslint
用途
允许开发者将 TypeScript 与 ESLint 结合使用。
提供了必要的配置和插件，使得在用 TypeScript 编码时，利用 ESLint 进行代码质量的检查和维护。
安装
pnpm add typescript-eslint -D
eslint-plugin-unused-imports
用途
用于查找并移除 ES6 模块中未使用的导入（imports）。
这个插件是作为 no-unused-vars 规则的补充，它依赖于 TypeScript/JavaScript 插件中的 no-unused-vars 规则。若要使这个插件正常工作，需要确保安装了 typescript-eslint 插件。
安装
pnpm add eslint-plugin-unused-imports -D
eslint-plugin-n
用途
应用于 Nodejs 的 Eslint 规则。
安装
pnpm add eslint-plugin-n -D
eslint-plugin-regexp
用途
应用于正则表达式 RegExp 的 Eslint 插件，可用于查找 RegExp 使用错误及格式问题。
安装
pnpm add eslint-plugin-regexp -D
eslint-config-flat-gitignore
用途
用于解析 .gitignore 文件或兼容格式的文件（如 .eslintignore），返回包含 ignore 模式 或 unignore 模式 的文件路径的数组。
ignore 模式 和 unignore 模式 是什么？以 .gitignore 为例：
ignore 模式：
例如，忽略所有 .txt 文件
*.txt
unignore 模式：
例如 unignore.txt 文件比较特殊，不需要忽略，通过在文件路径前加上 ! 符号，表示取消忽略。
!unignore.txt
安装
pnpm add eslint-config-flat-gitignore -D
eslint-plugin-eslint-comments
用途
提供对 Eslint 指令注释应用的最佳实践，例如 /* eslint-disable */。
例如：
- 不允许未使用的禁用指令。
- 不允许无效的启用指令。
- 禁用和启用指令需要提供对应的规则ID。
安装
pnpm add eslint-plugin-eslint-comments -D
eslint-plugin-import-x
用途
支持 ES6+ import/export 语法的格式化，以及防止文件路径和导入名称拼写错误的问题。
安装
pnpm add eslint-plugin-import-x -D
eslint-plugin-perfectionist
用途
于对不同类型的数据进行排序，包括对象、导入语句、TypeScript 类型、枚举、JSX 属性、Svelte 属性等，排序的方式可以是按字母顺序、自然顺序或按行长度排序。
安装
pnpm add eslint-plugin-perfectionist -D
eslint-plugin-unicorn
用途
内置大量 ESLint 规则，如 catch-error-name，empty-brace-spaces 等。
安装
pnpm add eslint-plugin-unicorn -D
扩展类
[Prettier]eslint-plugin-prettier
用途
用于 Prettier 格式化的 Eslint 插件，可以将 Prettier 格式化配置作为 Eslint 规则运行。
安装
pnpm add eslint-plugin-prettier -D
[Prettier]eslint-config-prettier
用途
关闭所有不必要或可能与 Prettier 冲突的 Eslint 规则。
安装
pnpm add eslint-config-prettier -D
[Vue]eslint-plugin-vue
用途
Vue 官方 Eslint 插件，允许我们使用 Eslint 检查 Vue 语法，如 <template>，<script> 等。
安装
pnpm add eslint-plugin-vue -D
[Vue]vue-eslint-parser
用途
Vue Eslint 自定义解析器，允许我们检查 .vue 文件的 <template> 标签内容，配合 eslint-plugin-vue 提供的规则使用。
安装
pnpm add vue-eslint-parser -D
[Markdown]eslint-plugin-markdown
用途
用于格式化 Markdown 中的 JS, JSX, TypeScript 等内容。
安装
pnpm add eslint-plugin-markdown -D
[Json]eslint-plugin-jsonc
用途
应用于 JSON, JSONC 和 JSON5 文件的 Eslint 插件。
安装
pnpm add eslint-plugin-jsonc -D
[Json]jsonc-eslint-parser
用途
JSON, JSONC 和 JSON5 文件的解析器，与 eslint-plugin-jsonc 插件配合使用。
安装
pnpm add jsonc-eslint-parser -D
结语
本文重点介绍了 ZimuAdmin 迁移 Eslint 到 V9.x 版本的具体过程，及使用到的 Eslint 相关插件，分为 基础类 和 语言拓展类，旨在帮助同学们加深对于新版 Eslint 迁移过程及相关工具的了解。希望对您有所帮助。
如您对文章内容有任何疑问或想深入讨论，欢迎评论区留下您的问题和见解。
技术简而不凡，创新生生不息。我是 嘟老板，咱们下期再会。
