ESLint插件是javaScript开发的实时代码教练，它在vs code中实时标红报错并提示规则ID，支持一键修复和保存时自动修正；通过eslint.validate覆盖多文件类型，结合项目根目录的.eslintrc.js配置规则，可按需设置"off""warn""Error"级别，并用overrides针对测试文件等特殊场景调整；团队可共享配置如airbnb-base统一风格；与Prettier协作时，用eslint-config-prettier关闭格式规则，由Prettier负责格式化，实现逻辑与格式分离；支持悬停查看错误详情、点击跳转文档或配置行，便于快速排查问题，临时忽略可用// eslint-disable-next-line；最终目标是将重复检查交工具，聚焦核心逻辑与业务设计。
ESLint插件在VS Code中不只是标红报错的工具，它是你写javascript时的实时代码教练——帮你避开常见陷阱、统一团队风格、提前发现潜在bug。
自动检测并修复基础问题
安装ESLint插件后，VS Code会在你敲代码时实时高亮不符合规则的地方，比如未使用的变量、缺少分号（如果启用了semi）、箭头函数单参数未加括号等。它不只提示，还能一键修复（Ctrl+Shift+P → “ESLint: Fix all auto-fixable problems”）。
- 启用
eslint.autoFixOnSave后，保存即自动修正可修复项 - 配合
eslint.validate配置，确保JS、JSX、vue、TS文件都被检查 - 常见修复项：缩进统一、引号风格（单/双）、空格位置、函数调用括号前后空格等
按项目定制规则，避免“一刀切”
每个项目可以有自己的.eslintrc.js或.eslintrc.json，明确告诉ESLint“我们允许什么、禁止什么”。比如react项目引入eslint-plugin-react，typescript项目搭配@typescript-eslint/eslint-plugin。
- 规则可设为
"off"（禁用）、"warn"（警告）、"error"（报错阻断） - 用
overrides对不同文件类型单独配置，如测试文件放宽no-console - 团队共享配置包（如
eslint-config-airbnb-base）能快速拉齐风格
与Prettier协同，格式+逻辑双保险
ESLint管逻辑和质量（如no-unused-vars），Prettier管格式（换行、缩进、引号）。两者共存易冲突，推荐用eslint-config-prettier关闭所有格式类规则，再用prettier插件负责美化。
- VS Code设置中把
editor.formatOnSave设为true，并指定editor.defaultFormatter为Prettier - ESLint插件保持开启，专注语义检查，不参与格式化
- 这样保存时：先ESLint检查逻辑 → 再Prettier统一格式 → 无冲突、不打架
快速定位问题根源，减少调试时间
鼠标悬停在波浪线下，直接看到规则ID（如eqeqeq）和说明；点击右下角ESLint状态栏，可跳转到具体规则文档，甚至一键跳转到.eslintrc中对应配置行。
- 遇到不理解的报错？搜规则名就能查到为什么禁用
==而推荐=== - 临时忽略某行可用
// eslint-disable-next-line no-alert - 想了解某条规则是否适合当前项目？查它的
recommended级别或社区实践
基本上就这些。ESLint插件不是要让你被规则束缚，而是把重复判断交给工具，把注意力留给真正重要的逻辑设计和业务思考。