设置自动化工作流程可以极大地提高项目中的代码质量和一致性。在本指南中，我们将逐步设置 husky、commitlint、prettier 和 lint-staging，以确保您的代码库格式一致、遵循提交消息约定，并在每次合并后具有最新的依赖项。
设置哈士奇
husky 帮助您轻松管理 git 挂钩，允许在每次提交之前运行代码质量检查等自动化任务。
安装
使用 npm 将 husky 安装为开发依赖项（我们将在本文中使用 npm）：
npm install --save-dev husky
初始化
要创建用于存储 git 挂钩的 .husky 目录，请运行：
npx husky init
接下来，在 package.json 中添加以下脚本以在安装依赖项时设置 husky：
"scripts": {
"prepare": "husky install"
}
配置 commitlint
commitlint 确保所有提交消息遵循一致的格式，维护干净的提交历史记录。
安装
安装 commitlint 以及常规配置：
npm install --save-dev @commitlint/config-conventional @commitlint/cli
设置
- 在 .husky 中创建一个 commit-msg 钩子： 现在在 .husky 目录中创建一个名为 commit-msg 的新文件并添加以下行：
npx husky add .husky/commit-msg "npx --no-install commitlint --edit \"$1\""
- 将 commitlint.config.js 文件添加到项目的根目录，其中包含以下内容：
module.exports = {
extends: ['@commitlint/config-conventional'],
rules: {
// todo add scope enum here
// 'scope-enum': [2, 'always', ['yourscope', 'yourscope']],
'type-enum': [
2,
'always',
[
'feat',
'fix',
'docs',
'chore',
'style',
'refactor',
'ci',
'test',
'revert',
'perf',
'vercel',
],
],
},
};
添加 lint-staging 和 prettier
lint-staging 允许您在暂存文件上运行脚本，而 prettier 在您的代码库中强制执行一致的样式。
安装
将两者安装为开发依赖项：
npm install --save-dev lint-staged prettier
更漂亮的配置
使用您首选的配置在项目根目录中创建一个 .prettierrc.json 文件。这是一个例子：
{
"plugins": ["prettier-plugin-tailwindcss"],
"printwidth": 120,
"usetabs": false,
"tabwidth": 2,
"trailingcomma": "es5",
"semi": true,
"singlequote": true,
"bracketspacing": true,
"arrowparens": "always",
"jsxsinglequote": false,
"bracketsameline": false,
"endofline": "lf"
}
lint 阶段配置
将以下配置添加到 lint-staged 下的 package.json 中：
"lint-staged": {
"**/*.{js,jsx,ts,tsx}": [
"eslint --max-warnings=0",
"prettier --write"
],
"**/*.{html,json,css,scss,md,mdx}": [
"prettier -w"
]
}
添加预提交挂钩来运行 lint-staging：
npx husky add .husky/pre-commit "npx lint-staged"
为依赖项添加合并后挂钩
合并后挂钩可确保每次合并后通过运行 npm install 或任何包管理器更新您的依赖项。
创建合并后钩子：
npx husky add .husky/post-merge "npm install"
结论
通过此设置，您的项目将维护标准化的提交消息格式，自动格式化代码，并在合并后保持依赖项最新。这种强大的工作流程将简化协作并提高代码质量，帮助您专注于构建出色的功能。
