在日常开发中,团队协作写代码最怕风格不统一。有人用四个空格缩进,有人偏爱两个;有人在分号上纠结,有人对引号挑剔。时间一长,代码文件看起来就像拼凑的杂文集。这时候,光靠人工盯着看已经不够用了,得靠工具来帮忙。
ESLint:JavaScript 的标配检查员
如果你写的是 JavaScript 或者 TypeScript 项目,ESLint 几乎是绕不开的选择。它能检测语法错误、潜在 bug,还能统一代码风格。比如你规定必须使用单引号,谁不小心写了双引号,保存文件时编辑器立马标红提醒。
{
"rules": {
"quotes": ["error", "single"]
}
}
把这段配置加进项目,团队成员只要装了插件,写代码就会自动对齐标准。
Prettier:格式化界的“强迫症终结者”
和 ESLint 搭配使用的还有 Prettier。它不像 ESLint 那样查逻辑问题,而是专注格式——括号要不要空格、一行太长是否换行、对象属性对不对齐。一旦启用,它会直接帮你重写代码,省得争论“哪种写法更好看”。
很多人习惯把 Prettier 和 ESLint 联动起来,先让 ESLint 把关规则,再由 Prettier 统一排版。这样既保安全又保美观。
Stylelint:专治 CSS 不规范
别以为只有 JS 才需要管。CSS 写得乱七八糟,后期维护一样头疼。比如命名混乱、属性顺序随意、用了被禁的颜色值。Stylelint 就是干这个的,支持自定义规则,还能集成到 Webpack 或 Vite 构建流程里。
{
"rules": {
"color-hex-case": "lower"
}
}
这条规则确保所有颜色值都用小写十六进制,避免 #FFAABB 和 #ffaabb 混着出现。
Git Hooks + Husky:提交前自动拦截
就算配置了检查工具,总有人忘了运行。这时候可以配上 Husky,在 git commit 前自动触发 lint 检查。如果代码不合规范,提交就被拦下,非得改好了才能进版本库。
想象一下,周五下午你想赶紧提交代码下班,结果因为少了个分号卡住——虽然当时烦躁,但第二天回头看,反而感谢这套机制没让你留下烂摊子。
编辑器实时反馈更高效
VS Code 安装对应插件后,写代码的同时就能看到波浪线提示。鼠标放上去告诉你哪条规则违规,点一下还能自动修复。这种即时反馈比等到构建失败再回头找问题要省心得多。
工具本身不难配,关键是团队达成一致并坚持使用。一套合理的编码标准加上趁手的工具组合,长期下来能省下大量沟通成本,也让新人接手项目更容易。