eslint 8 到 9 属于破坏性更新（Break Change），因此导致 eslint 8 配置方式无法直接使用（可以使用兼容包，但这不是本文的主题）。
其实大家最关心的就是从 eslint 8 到 9 之后的写法，而与 eslint 息息相关的多种配置插件也需要大量的变更，因此本文核心就是：使用 eslint9 配置规则和集成 prettier。
废话不多说，开始。
环境要求
不支持 Node 19 所有版本，Node 18最低要求 18.8.0，Node 20最低要求 20.9.0 及 Node 21.1.0 以上。
升级 eslint 至最新版
9.9.0 是我写文章时的最新版本
npm i eslint@^9.9.0 -D
安装 @eslint/js
npm i @eslint/js -D
安装 typescript-eslint
npm i typescript-eslint -D
该文件包含了 @typescript-eslint/parser 和 @typescript-eslint/eslint-plugin，因此需移除以上两个依赖，而且以上两个插件不直接支持 eslint9
安装 globals
npm i globals -D
该包在 eslint 的配置中会用到
移除 eslint-config-prettier
eslint 在 8.53.0 之后就不再支持格式化规则，因此 eslint-config-prettier 作为 eslint 和 prettier 的规则冲突解决插件，已经没用了。
旧 eslint 配置文件改名为 eslint.config.js
在 8 版本及之前，eslint 默认读取的以上配置文件中，package.json 配置已在 9 中移除，其余配置的兼容性在 10 版本会移除
需提前安装 prettier 和 eslint-plugin-prettier
由于项目是 react，所以 react 相关的都注释掉了，可以参考写法进行配置。
新的 eslint.config.js 内容如下
import js from "@eslint/js";
import globals from "globals";
// import reactHooks from "eslint-plugin-react-hooks";
// import reactRefresh from "eslint-plugin-react-refresh";
import tseslint from "typescript-eslint";
import eslintPluginPrettierRecommended from "eslint-plugin-prettier/recommended";
export default tseslint.config({
extends: [
js.configs.recommended,
...tseslint.configs.recommended,
eslintPluginPrettierRecommended,
],
files: ["**/*.{ts,tsx,js,jsx}"], // eslint 检测的文件，根据需要自行设置
ignores: ["dist"],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
plugins: {
// "react-hooks": reactHooks,
// "react-refresh": reactRefresh,
},
rules: {
...reactHooks.configs.recommended.rules,
// "react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
"prettier/prettier": "warn", // 默认为 error
"arrow-body-style": "off",
"prefer-arrow-callback": "off",
"@typescript-eslint/no-explicit-any": "off", // allow any type
},
});
eslint-plugin-react-hooks 和 eslint-plugin-react-refresh 为 react 相关规则插件，可根据项目框架自行设置 plugins。
验证 eslint 和 prettier 的正确运作
eslint-plugin-react-hooks 不兼容 eslint9 处理
eslint-plugin-react-hooks 若需要兼容 eslint9，需安装 rc 版本
npm i eslint-plugin-react-hooks@^5.1.0-rc.0 -D