Git 提交流程自动化：Hook 触发增量 Lint 检查并规范化提交信息
husky 挂载 Git Hook，lint-staged 只检查暂存文件提速，Commitizen+Commitlint 保证提交信息规范
✓ 提交前自动代码检查✓ 提交信息统一规范
方案简介
该配方是 vue3.0-template-admin 内置的前端工程化方案：通过 husky 挂载 Git Hook，在提交时由 lint-staged 对暂存代码执行 lint 检查；代码风格由 EditorConfig、Prettier、ESLint 并配合 Airbnb JavaScript Style Guide 统一约束；提交信息通过 Commitizen 交互式生成并由 Commitlint 校验；同时使用 only-allow 统一包管理器。这一组合让团队协作时代码风格一致、提交历史规范可追溯。
组成与分工
- husky：Git Hook 工具，在 git 提交等时机自动触发脚本
- lint-staged：只对暂存（staged）文件执行 lint，检查更快
- ESLint（含 eslint-plugin-vue）：代码质量与 Vue 规范检查
- Prettier + EditorConfig：统一代码格式化与编辑器配置
- Airbnb JavaScript Style Guide：代码风格基准
- Commitizen：交互式生成规范提交信息（git cz）
- Commitlint：校验提交信息是否符合规范
- only-allow：约束团队统一使用指定包管理器
使用与配置要点
日常开发提交流程：
bash
git add * // add everything
git status // check status
git cz // commit change
git push // push stage commit
如果 cz 命令无法找到，全局安装 commitizen：
bash
npm install -g commitizen
优缺点
- ✓ 提交前自动代码检查
- ✓ 提交信息统一规范
出处
本方案挖掘自开源项目 GeekQiaQia/vue3.0-template-admin，方案内容与实施命令均来自其 README 原文。
方案出处
GeekQiaQia/vue3.0-template-admin：本项目基于vue3+ElementPlus+Typescript+Vite搭建一套通用的后台管理模板；并基于常见业务场景，抽象出常见功能组件；包括动态菜单，菜单 1349 star 本项目基于vue3+ElementPlus+Typescript+Vite搭建一套通用的后台管理模板；并基于常见业务场景，抽象出常见功能组件；包括动态菜单，菜单权限、登录、主题切换、国际化、个人中心、表单页、列表页、复制文本、二维码分享等等
本方案由真实开源项目挖掘整理，实施命令均来自其 README 原文，安装使用请遵循项目开源协议。