关于husky代码提交检查和校验

163 阅读2分钟

husky自动化安装

husky-init 是一个一次性命令,用于使用 husky 快速初始化项目,并在项目根目录创建.husky文件,并创建一个pre-commit可以编辑的示例挂钩。

npm安装方法

npx husky-init && npm install

yarn1安装方法

npx husky-init && yarn

yarn2安装方法

yarn dlx husky-init --yarn2 && yarn

package.jsonscripts变化

"prepare":"husky install" 在执行npm命令时会执行husky的初始化

image.png

pre-commit钩子配置:

npx --no-install lint-staged

优点:只检查暂存区的文件,lint文件少而快

缺点:检查不全面

image.png

lint-staged配置:

lint-staged是一个在git暂存文件上运行linters的工具

安装: npm install lint-staged

package.json内配置:(也可以在根目录新建.lintstagedrc.js文件)

以下配置是过滤git暂存文件中的js和vue文件,传递给linter

  lint-staged": {
    "*.{js,vue}": [
      "npm run lint"
    ]
  }

commit-msg钩子配置:

image.png

安装配置commitlint

npm install @commitlint/cli --save-dev

npm install @commitlint/config-conventional --save-dev

commitlint/cli 是commitlint提供的命令行工具,安装后会将cli脚本放置在./node_modules/.bin/目录下

commitlint/config-conventional是社区中一些共享的配置,我们可以扩展这些配置,也可以不安装这个包自定义配置

初始化commitlint/cli的配置文件,在项目根目录创建名为.commitlintrc.js文件或者 commitlint.config.js的文件

.commitlintrc.js文件

module.exports = {
  extends: ["@commitlint/config-conventional"],
  rules: {
    "subject-case": [0, "never"],
    "type-enum": [
      2,
      "always",
      [
        "build", // 主要目的是修改项目构建系统(例如 glup,webpack,rollup 的配置等)的提交
        "ci", // 主要目的是修改项目继续集成流程(例如 Travis,Jenkins,GitLab CI,Circle等)的提交
        "chore", // 不属于以上类型的其他类型(日常事务)
        "docs", // 仅仅修改了文档,比如README, CHANGELOG, CONTRIBUTE等等
        "feat", // 新增功能
        "fix", // 修复bug
        "perf", // 优化相关,比如提升性能、体验
        "refactor", // 代码重构,没有加新功能或者修复bug
        "revert", // 回滚某个更早之前的提交
        "style", // 不影响程序逻辑的代码修改(修改空白字符,补全缺失的分号等)
        "test", // 新增测试用例或是更新现有测试
      ],
    ],
  },
};

提交规范:

git commit -m <type>[optional scope]: <description> (注意冒号后面有空格)

type:用于表明我们这次提交的改动类型,是新增了功能?还是修改了测试代码?又或者是更新了文档?

optional scope:一个可选的修改范围。用于标识此次提交主要涉及到代码中哪个模块。

description:一句话描述此次提交的主要内容,做到言简意赅。

例如:

git commit -m 'feat(table): 增加 xxx 功能'

git commit -m 'bug: 修复 xxx 功能'

总结一下husky的整体工作流程:

image.png