vue3+vite+ts 配置commit强制码提交规范配置 commitlint

配置 git 提交时的 commit 信息,统一提交 git 提交规范

安装命令:

bash 复制代码
npm install -g commitizen
npm i cz-customizable
npm i @commitlint/config-conventional @commitlint/cli -D

文件配置

根路径创建文件

commitlint.config.js

javascript 复制代码
module.exports = {
  // 继承的规则
  extends: ['@commitlint/config-conventional'],
}

.husky文件创建 commit-msg

javascript 复制代码
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npx --no-install commitlint --edit "$1"

package.json添加代码

javascript 复制代码
  "husky": {
    "hooks": {
      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
    }
  },

提交方式

1,手动使用commit

bash 复制代码
git commit -m 'feat(custom): 测试提交'

2.配合vscode中的插件快捷提交 git-commit-plugin

在vscode的设置中加入配置,不然会有小图标导致commit不通过

javascript 复制代码
 "GitCommitPlugin.ShowEmoji":false,//去除commIt插件图标

3.以是使用npm脚本进行快捷提交

在根目录下新建 .cz-config.cjs 文件并写入配置 之后就可以用 git cz 来代替 git commit

.cz-config.cjs

javascript 复制代码
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: '请选择提交类型(必填):',
      subject: '请简要描述提交(必填):',
      customScope: '请输入修改范围(可选):',      
      body: '请输入详细描述(可选):',
      footer: '请输入要关闭的issue(可选):',
      confirmCommit: '确认使用以上信息提交?(y/n/e/h)'
    },
    // 跳过问题
    skipQuestions: ['body', 'footer'],
    // subject文字长度默认是72
    subjectLimit: 72
  }

在package.json中进行新增

javascript 复制代码
  "scripts": {
    "commit":"git cz"
  },  
"config": {
    "commitizen": {
      "path": "node_modules/cz-customizable"
    },
    "cz-customizable": {
      "config": ".cz-config.cjs"
    }
  },

执行npm 中的commit脚本

相关推荐
木斯佳3 小时前
前端八股文面经大全:26届秋招滴滴校招前端一面面经-事件循环题解析
前端·状态模式
光影少年3 小时前
react状态管理都有哪些及优缺点和应用场景
前端·react.js·前端框架
saber_andlibert5 小时前
TCMalloc底层实现
java·前端·网络
逍遥德5 小时前
如何学编程之01.理论篇.如何通过阅读代码来提高自己的编程能力?
前端·后端·程序人生·重构·软件构建·代码规范
冻感糕人~5 小时前
【珍藏必备】ReAct框架实战指南:从零开始构建AI智能体,让大模型学会思考与行动
java·前端·人工智能·react.js·大模型·就业·大模型学习
程序员agions5 小时前
2026年,“配置工程师“终于死绝了
前端·程序人生
alice--小文子5 小时前
cursor-mcp工具使用
java·服务器·前端
晚霞的不甘5 小时前
揭秘 CANN 内存管理:如何让大模型在小设备上“轻装上阵”?
前端·数据库·经验分享·flutter·3d
小迷糊的学习记录5 小时前
0.1 + 0.2 不等于 0.3
前端·javascript·面试
梦帮科技6 小时前
Node.js配置生成器CLI工具开发实战
前端·人工智能·windows·前端框架·node.js·json