为下一个大型项目设置ESLint自动化的简单分步指南
内容提要
本文介绍了使用ESLint设置项目代码规范和自动重新组织代码的方法。重点强调了组织import语句的重要性，包括提高代码可读性、维护性、一致性和调试性。提供了安装依赖、创建配置文件、配置TypeScript和代码编辑器的步骤。总结了ESLint的其他功能和好处，并强调了良好的代码组织对于创建清晰、易于维护和减少错误的代码库的重要性。
延伸解读
为什么需要自动化整理 import
文章指出，杂乱无章的 import 语句会严重影响代码的可读性、维护性、一致性和调试效率。手动整理不仅耗时，还容易因团队成员习惯不同而产生分歧。通过 ESLint 自动化这一过程，可以确保每次保存文件时 import 都按统一规则重新排列，从而减少人为疏忽，让开发者更专注于业务逻辑而非格式调整。
ESLint 配置的核心规则解析
文章提供的 .eslintrc.json 配置中，import/order 规则将 import 分为三组：内置/外部模块、内部模块、相对路径模块，并要求组间空行、组内按字母升序排列。import/newline-after-import 则强制最后一个 import 后留一空行。这些规则共同作用，使 import 区域结构清晰，便于快速定位依赖来源。
与 TypeScript 和编辑器的协同
若项目使用 TypeScript，需在 tsconfig.json 中配置 baseUrl 和 paths 以支持路径别名，否则 ESLint 可能无法正确解析 import。此外，在 VS Code 中设置 editor.codeActionsOnSave 为 source.fixAll.eslint，即可在保存时自动修复 import 组织问题，将规则落地到日常开发流程中，显著提升效率。
超越 import 整理的 ESLint 价值
文章强调，ESLint 不仅能整理 import，还能在运行前捕捉潜在错误、强制团队统一代码风格、鼓励最佳实践，并支持自定义规则。通过 package.json 中的 lint 和 lint:fix 脚本，可以一键检查或修复整个项目。良好的代码组织是构建清晰、易维护、低错误代码库的重要基础。
Q&A
为什么组织import语句很重要？
组织import语句可以提高代码的可读性、维护性、一致性和调试性。
如何安装ESLint及其依赖？
在终端中运行命令：npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-plugin-import eslint-import-resolver-typescript。
如何配置ESLint的规则？
在.eslintrc.json文件中配置import的分组、排序和空行规则。
如何在代码编辑器中设置ESLint自动修复功能？
在Visual Studio Code的设置中添加：{"editor.codeActionsOnSave": {"source.fixAll.eslint": true}}。
如何在项目中添加检查和修复所有文件的命令？
在package.json的scripts部分添加："lint": "eslint ." 和 "lint:fix": "eslint . --fix"。
使用ESLint还有哪些其他好处？
ESLint可以捕捉错误、强制风格、鼓励最佳实践和自定义规则。
