前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >前端代码风格自动化系列(二)之Commitlint

前端代码风格自动化系列(二)之Commitlint

作者头像
河马嘴不大
发布2022-12-24 12:21:41
6100
发布2022-12-24 12:21:41
举报
文章被收录于专栏:前后两端不设限

在有了Husky赋能之后,我们有能力在Git的钩子里做一些事情,首先不得不提的是代码的提交规范和规范的校验,优雅的提交,方便团队协作和快速定位问题。首推Commitlint,另外@加神 推荐了Gitmoji也是一个很有意思的工具。

安装

代码语言:javascript
复制
npm install --save-dev @commitlint/config-conventional @commitlint/cli

// 生成配置文件commitlint.config.js,当然也可以是 .commitlintrc.js
echo "module.exports = {extends: ['@commitlint/config-conventional']};" > commitlint.config.js

配置

在husky的配置加入CommitlIint配置,v1.0.1版本以后为HUSKY_GIT_PARAMSv0.14.3GIT_PARAMS

代码语言:javascript
复制
"husky": {
    "hooks": {
      "pre-commit": "npm run test",
      "commit-msg": "commitlint -e $HUSKY_GIT_PARAMS"
    }
  },

定制提交规范

提交格式(注意冒号后面有空格)
代码语言:javascript
复制
<type>: <subject>
常用的type类别
  • upd:更新某功能(不是 feat, 不是 fix)
  • feat:新功能(feature)
  • fix:修补bug
  • docs:文档(documentation)
  • style: 格式(不影响代码运行的变动)
  • refactor:重构(即不是新增功能,也不是修改bug的代码变动)
  • test:增加测试
  • chore:构建过程或辅助工具的变动

例子:

代码语言:javascript
复制
git commit -m 'feat: 增加 xxx 功能'
git commit -m 'bug: 修复 xxx 功能'
subject

subject是 commit 目的的简短描述,可以做一些配置,如最大长度限制。

commitlint.config.js文件配置

rule配置说明::rule由name和配置数组组成,如:'name:[0, 'always', 72]',数组中第一位为level,可选0,1,2,0为disable,1为warning,2为error,第二位为应用与否,可选always|never,第三位该rule的值。具体配置例子如下:

代码语言:javascript
复制
module.exports = {
  extends: [
    "@commitlint/config-conventional"
  ],
  rules: {
    'type-enum': [2, 'always', [
      'upd', 'feat', 'fix', 'refactor', 'docs', 'chore', 'style', 'revert'
     ]],
    'type-case': [0],
    'type-empty': [0],
    'scope-empty': [0],
    'scope-case': [0],
    'subject-full-stop': [0, 'never'],
    'subject-case': [0, 'never'],
    'header-max-length': [0, 'always', 72]
  }
};

这里列出了大部分常用的配置,其它的可以参考Commitlint网站,具体使用例子:

这里我们使用错误的提交方式,最上面的是自动测试的脚本,大家可以忽略,husky给出了commit-msg的input为xxx,触发了subject-emptytype-empty两个规则,提交不符合规范,被拦了下来。如果是正确的提交,例子如下:

关于Commitlint的使用就到这里了。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2019-01-07,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 安装
  • 配置
  • 定制提交规范
    • 提交格式(注意冒号后面有空格)
      • 常用的type类别
        • subject
        • commitlint.config.js文件配置
        相关产品与服务
        Prowork 团队协同
        ProWork 团队协同(以下简称 ProWork )是便捷高效的协同平台,为团队中的不同角色提供支持。团队成员可以通过日历、清单来规划每⽇的工作,同时管理者也可以通过统计报表随时掌握团队状况。ProWork 摒弃了僵化的流程,通过灵活轻量的任务管理体系,满足不同团队的实际情况,目前 ProWork 所有功能均可免费使用。
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档