记录为项目添加git提交规范

前言：

我们前端团队就几个人（部署还是走的自动化构建的），以前提交代码呢，就是 git add ., git commit -m ,git push origin 'name'.一套打完直接下机走人。 直到有一天测试环境代码跑不动，查看构建信息才发现有位小伙伴提交代码的时候并没合并就提交上去了(我也表示神奇)

为了防止这样的事情再次发生呢，就去网上扒拉了一些git提交工具文章，准备使用commitizen、cz-conventional-changelog、cz-customizable这三个工具整合到项目中。

1、首先安装插件

yarn add commitizen -D cz-conventional-changelog -D cz-customizable -D

2、配置package(在根目录package.json里面添加)

"config": {
    "commitizen": {
      "path": "node_modules/cz-customizable"
    }
  },

3、配置规范(使用Angular提交的规范)

在根目录创建.cz-config.js

//.cz-config.js
module.exports = {
  types: [
    {
      value: "init",
      name: "✨  init:     项目初始化",
    },
    {
      value: "feat",
      name: "✨  feat:     新增功能",
    },
    {
      value: "fix",
      name: "✨  fix:      bug修复",
    },
    {
      value: "refactor",
      name: "✨  refactor: 代码重构(不包括 bug 修复、功能新增)",
    },
    {
      value: "docs",
      name: "✨  docs:     文档更新",
    },
    {
      value: "test",
      name: "✨  test:     添加、修改测试用例",
    },
    {
      value: "chore",
      name: "✨  chore:    对构建过程或辅助工具和库的更改(不影响源文件、测试用例)",
    },
    {
      value: "style",
      name: "✨  style:    代码格式(不影响功能，例如空格、分号等格式修正)",
    },
  ],

  scopes: [
    ["pages", "页面相关"],
    ["api", "接口相关"],
    ["utils", "公共方法相关"],
    ["components", "组件相关"],
    ["hooks", "hook 相关"],
    ["ui", "对ui 的调整"],
    ["styles", "样式相关"],
    ["plugins", "plugins修改"],
    ["store", "store修改"],
    ["deps", "项目依赖"],
    ["auth", "对 auth 修改"],
    ["README", "README修改"],
    ["other", "其他修改"],
    ["custom", "以上都不是？我要自定义"],
  ].map(([value, description]) => {
    return {
      value,
      name: `${value.padEnd(30)} (${description})`,
    };
  }),
  messages: {
    type: "确保本次提交遵循规范！\n选择你要提交的类型：",
    customScope: "请输入自定义的 scope:",
    subject: "填写本次提交描述* ( 一句话概括 ):\n",
    body: '填写更加详细的变更描述 ( 不填可以直接回车,话多使用 "|" 换行 ):\n',
    breaking:
      '列举非兼容性重大的变更 ( 不填可以直接回车,话多使用 "|" 换行 ):\n',
    footer:
      '列举出所有变更的 ISSUES CLOSED 例如: #31, #34 ( 不填可以直接回车,话多使用 "|" 换行 ):\n',
    confirmCommit:
      '确认提交？( 这步完了 需要在控制台输入 "git push origin <你需要提交远程分支名>" )',
  },
  allowCustomScopes: true,
  allowBreakingChanges: ["feat", "fix"],
};

最后在package.json里面添加执行脚本命令

"commit": "git add . && git-cz"

如果你还想在提交代码前检测一下代码(vue)

"commit": "vue-cli-service lint --fix --ext .js,.vue,.ts && git add . && git-cz"

最后直接输入命令： yarn commit

看到下图就证明成功了