ESLint 10
使用ESLint10的先决条件
1.node版本必须是这三类之一
- 20.19.0及以上的20.x版本
- 22.13.0及以上的22.x版本
- 24.x及以上的更高版本
2.需要SSL支持
这个SSL就是给网络数据加密用的，保证你电脑和服务器之间传的数据不被窃取，官方node自带，可以不用管
3.TS要求
如果你使用的是ts的话，最少要5.3版本及以上
快速开始
安装并配置(以pnpm为例)
pnpm create @eslint/config@latest
用现成共享配置的命令
如果你想直接用npm上现成的、别人分享好的配置，可以使用 --config 参数指定包名
# use `eslint-config-xo` shared config - npm 7+
pnpm create @eslint/config@latest -- --config eslint-config-xo
npm init @eslint/config assumes you have a package.json file already，就是它默认你有package.json文件了，
如果没有需要先初始化项目
检查：
pnpm dlx eslint yourfile.js 把yourfile.js换成你要检查的文件就好了
配置
eslint.config.js配置文件
ESLint v10的扁平配置格式，彻底替代了旧版的 .eslintrc 。ESLint是零规则默认，意思就是不写extends就等于白装
import js from "@eslint/js";
// 引入eslint官方内置的js规则集，是所有js检查的基础
import globals from "globals";
// 引入全局变量定义库，告诉eslint哪些是环境自带的全局变量（比如window），避免报未定义错误
import pluginVue from "eslint-plugin-vue";
// 引入vue专属eslint插件，专门检查.vue文件的语法、规范
import css from "@eslint/css";
//引入eslint官方内置的css规则集，检查css代码规范
import { defineConfig } from "eslint/config";
// 引入类型安全工具，给配置文件加ts智能提示，防止写错配置项
export default defineConfig([
{ files: ["**/*.{js,mjs,cjs,vue}"], plugins: { js }, extends: ["js/recommended"], languageOptions: { globals: globals.browser } },
// files: 规则生效范围，**/*.表示所有，["**/*.{js,mjs,cjs,vue}"]表示项目中的所有{js,mjs,cjs,vue}都要应用这个配置
// plugins: { js }，注册js规则插件，让eslint能够识别并执行js相关规则
// extends: ["js/recommended"] 启用eslint官方推荐的js规则
// languageOptions: { globals: globals.browser } 声明全局变量
pluginVue.configs["flat/essential"],
// vue给eslint写好的一整套vue代码检查规则
{ files: ["**/*.css"], plugins: { css }, language: "css/css", extends: ["css/recommended"] },
]);
// 参考上面js文件规则解释
什么是rules 配置
rules 是eslint 配置里最核心的自定义入口，用来单独开关、调整每一条检查规则
"off"or0- turn the rule off // 完全不检查这条规则"warn"or1- turn the rule on as a warning (doesn’t affect exit code) //终端只打黄色警告，不阻断命令执行"error"or2- turn the rule on as an error (exit code will be 1) // 打红色错误，阻断执行
继承规则的优先级
extends继承的共享配置，比如js/recommended 会给规则设置默认级别，而rules里的配置会覆盖默认值
规则命名规范
都是以小写+连字符格式，可以在eslint官网查看所有规则
配置位置
rules可以写在任意配置对象里，作用范围由 files决定
全局安装
npm install eslint --global全局安装，但是不推荐，因为
- 不同项目可能依赖不同版本eslint，全局安装会导致版本冲突
- 团队协作时导致成员环境不一致
- 即使全局安装了，插件和共享配置也需要在本地安装
手动配置
如果你使用 pnpm 管理包，必须要新建一个 .npmrc 文件，并且配置
auto-install-peers=true
# 自动安装对等依赖，开启后会自动补全依赖，避免eslint插件因缺失依赖报错
node-linker=hoisted
# 将依赖提升到根目录，兼容npm结构，解决插件找不到依赖的问题
确保pnpm以更兼容npm的方式安装依赖，降低报错概率
补充
pnpm默认和npm存放依赖方式不同，npm是将所有依赖平铺提升到项目根目录，所有包能找到对方，不用考虑路径问题，但是产生
大量冗余依赖。而pnpm采用硬连接隔离式，把依赖存放到pnpm自己的仓库里，通过硬链接到项目的.pnpm目录，极致节省空间，不冲突，没有冗余，但是很多老工具是按根目录平铺结构写的，在根目录找不到直接报错
这里就不再赘述手动配置，因为前面已经自动配置了，感兴趣可以去官网看
