vue3 + Element-plus 开发后台管理系统（4）

刘勇_前端狗
234 阅读3分钟

携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第4天，点击查看活动详情

编程规范分析

规范三：约定式提交规范

前一篇文章我们通过 Prettier + ESLint 解决了代码格式的问题，但是，我们的编程规范肯定不仅仅指的是代码格式的规范，还有一方面就是 git 提交的规范

在如今的开发中，不出意外的话，大家应该都是利用 git 来进行项目的管理，那么我们就一定会遇到使用 git 提交代码的情况

在我们提交代码时，有一步是通过 git commit -m '描述信息' 去给我们将要提交的代码添加一个描述信息，但中华语言博大精深，即使是修改的同一个内容在不同的人手中编写的描述信息也不尽相同。这样一个问题点就出现了，那就是其他人在看你的提交记录时可能完全不明白你说的是什么，亦或者是把你的意思理解成了另一种意思，这样就有可能在修改代码时产生bug，造成潜在的风险

我们看一下下面这几个提交记录：

WX20220730-161516@2x.png

哈哈哈，你能想象出来他们经历了什么吗？（这还是我写的，我都不记得了）

由此可以看出，git 的提交规范势在必行

那我们怎么去规定提交规范呢，总不能是有些一本书让小伙伴们去研读吧

当然不是，我们还是要借助工具的，他就是 Commitizen，使用他可以帮助你规范化提交代码，下边我们就来看一看他是怎么用的

Commitizen 仓库名为 cz-cli，它提供了一个 git cz 的命令用于替代 git commit

1、全局安装 Commitizen

npm install -g commitizen

2、添加并配置 cz-customozable 插件

  • 使用 npm 下载 cz-customozable

    npm i cz-customizable --save-dev

  • 添加以下配置到 package.json 中

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

  • 项目根目录下创建 .cz-config.js 自定义提示文件

    module.exports = {
  // 可选类型
  types: [
    { value: 'feat', name: 'feat:     新功能' },
    { value: 'fix', name: 'fix:      修复' },
    { value: 'docs', name: 'docs:     文档变更' },
    { value: 'style', name: 'style:    代码格式(不影响代码运行的变动)' },
    {
      value: 'refactor',
      name: 'refactor: 重构(既不是增加feature，也不是修复bug)'
    },
    { value: 'perf', name: 'perf:     性能优化' },
    { value: 'test', name: 'test:     增加测试' },
    { value: 'chore', name: 'chore:    构建过程或辅助工具的变动' },
    { value: 'revert', name: 'revert:   回退' },
    { value: 'build', name: 'build:    打包' }
  ],
  // 消息步骤
  messages: {
    type: '请选择提交类型:',
    customScope: '请输入修改范围(可选):',
    subject: '请简要描述提交(必填):',
    body: '请输入详细描述(可选):',
    footer: '请输入要关闭的issue(可选):',
    confirmCommit: '确认使用以上信息提交？(y/n/e/h)'
  },
  // 跳过问题
  skipQuestions: ['body', 'footer'],
  // subject文字长度默认是72
  subjectLimit: 72
}

  • 提交时使用 git cz 代替 git commit

至此，我们提交时只需要使用 git cz 进行提交就能够选用我们配置文件中的内容、格式对 git 提交进行规范化了

avatar
文章
阅读
粉丝