在软件开发流程里，代码风格检查（Code Linting）几乎是保证代码质量和一致性的标配动作。不过，传统的做法往往把 Lint 放在 Code Review 或者 CI 阶段去跑，这就意味着问题发现得晚，反馈链条拉得长，修改起来也费劲。更理想的做法是：在开发者提交代码之前就把这些检查跑一遍，有问题当场解决，别让它们流到后面去。而利用 Git 的 Pre Commit 钩子，配合几个小工具，就能轻松实现这个目标。
简介
先快速认识一下三个主角：
prettier：专门用来统一代码格式，比如缩进、空格、分号这些小细节，不涉及逻辑判断。husky：一个能帮你管理 Git Hook 的工具，这里我们主要用它来绑定 pre-commit 这个钩子——在 commit 执行之前，触发自定义操作。lint-staged：它的作用是对 Git 暂存区里的文件执行代码检查，比如配合 ESLint 或 Prettier。
整个流程可以这样理解：
- 开发者写完代码，执行
git add把文件加到暂存区 - 然后执行
git commit - husky 捕获到 pre-commit 事件，自动调用 lint-staged
- lint-staged 拿到所有被提交的文件，依次执行预设的任务（例如 ESLint 检查、Prettier 格式化）
- 如果检查不通过，比如 ESLint 报错了，任务就会中断，同时打印错误信息，这次 commit 被拒绝
- 如果全部通过，commit 成功，代码顺利入库
安装
用 npm 或 yarn 把这两个工具装到项目的 devDependencies 里就行：
npm install husky lint-staged --sa ve-dev
或者
yarn add husky lint-staged --dev
配置package.json（无prettier）
如果项目里暂时不需要 Prettier，只做 ESLint 检查，可以在 package.json 里追加以下配置：
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --open",
...
"eslint": "eslint --ext .js,.vue src",
"eslintfix": "eslint --fix --ext .js,.vue src",
"lint-staged": "lint-staged"
},
"husky": {
"hooks": {
"pre-commit": "npm run lint-staged"
}
},
"lint-staged": {
"**/*.{js,vue}": [
"npm run eslint"
]
},
注意，这里没有加 prettier，只对 .js 和 .vue 文件执行 ESLint 检查。
配置package.json（有prettier）
如果打算同时使用 Prettier 来自动格式化代码，再配合 ESLint 检查，可以参考下面的配置（这是 Vue 项目中比较常见的组合）：
{
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{js,vue}": [
"prettier --write",
"vue-cli-service lint",
"git add"
]
}
}
解释一下每个步骤的作用：
prettier --write：自动按 Prettier 规则美化代码格式，并覆盖原文件。vue-cli-service lint：Vue 项目的语法检查工具，相当于带 ESLint 的封装。git add：将格式化后的文件再次添加到暂存区，确保 commit 里的代码已经是最新格式。
当然，如果你用的是其他技术栈，只要把对应检查命令替换进去即可。
.prettierrc文件
新建一个 .prettierrc 文件，把下面的规则放进去，就能定义你想要的代码风格：
{
"trailingComma": "es5", // 尾随逗号
"tabWidth": 2, // 缩进宽度
"semi": false, // 不要句尾分号
"singleQuote": true, // 使用单引号
"end-of-line": "lf" // 换行符统一为 LF
}
完成以上配置后，当你执行 git commit 时，Lint 程序就会自动检查本次提交所涉及的文件。一旦代码不符合规范，commit 会被直接拒绝，并给出错误提示。如果遇到特殊情况想跳过检查，在提交时加上 --no-verify 参数即可：git commit -no-verify。
总结
通过 husky + lint-staged 的组合，把代码检查提前到 commit 之前，能有效减少后期修复的成本，也能让团队代码风格更统一。配置起来并不复杂，但收益却很明显——代码质量的门槛一下就提高了。
