配置Prettier和ESLint实现代码格式化与检查，2. 通过Husky和lint-staged在git commit前自动执行格式化与lint，3. 统一团队配置确保代码风格一致，最终实现提交前自动化代码质量保障。
要在提交代码前让 VSCode 自动格式化并运行 lint 检查，不能仅靠编辑器本身设置完成，需要结合 Git 的 husky 和代码检查工具（如 ESLint、Prettier）来实现。VSCode 提供格式化支持，但自动触发是在 Git 提交阶段通过钩子完成的。
1. 安装并配置 Prettier 和 ESLint
确保项目中已安装并配置好代码格式化和检查工具：
- 在项目根目录运行：
npm install --save-dev prettier eslint - 创建或更新
.prettierrc配置文件（例如设置缩进、引号等） - 配置
.eslintrc.js或.eslintrc.json，启用你想要的规则 - 在
package.json中添加脚本："lint": "eslint . --ext .js,.jsx,.ts,.tsx"
同时，在 VSCode 中设置默认格式化工具：
- 打开命令面板（Ctrl+Shift+P）
- 输入 “Preferences: Open Settings (JSON)”
- 添加以下内容：
{ “editor.defaultFormatter”: “esbenp.prettier-vscode“, “editor.formatOnSave”: true, “editor.codeActionsOnSave”: { “source.fixAll.eslint”: true } }
这样保存时会自动格式化并修复 ESLint 可修复的问题。
2. 使用 Husky 和 lint-staged 在提交前检查
要实现在 git commit 前自动格式化和 lint，需使用 husky 触发 pre-commit 钩子。
- 安装依赖：
npm install --save-dev husky lint-staged - 启用 Husky：
npx husky init - 修改生成的
.husky/pre-commit文件：
#!/bin/sh npx lint-staged
- 在
package.json中添加 lint-staged 配置：
“lint-staged”: { “*.{js,jsx,ts,tsx}”: [ “prettier –write”, “eslint –fix” ] }
这样每次执行 git commit 时，会先对暂存区的文件运行 Prettier 格式化和 ESLint 修复，如果有错误无法修复，提交会被中断。
3. 确保团队统一配置
为了防止不同开发环境产生格式差异，建议：
- 将
.prettierrc0 提交到仓库（可选，但需团队共识） - 提供统一的
.prettierrc、.prettierrc2、.prettierrc3 - 在 README 中说明开发环境要求
基本上就这些。VSCode 负责编辑时的即时反馈，而真正的“提交前检查”是靠 husky + lint-staged 实现的。这套流程能有效保证提交到仓库的代码始终整洁合规。