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

本文主要是介绍vue3+vite+ts 配置commit强制码提交规范配置 commitlint,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

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

安装命令: 

npm install -g commitizen
npm i cz-customizable
npm i @commitlint/config-conventional @commitlint/cli -D

文件配置

根路径创建文件

commitlint.config.js

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

.husky文件创建  commit-msg

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"npx --no-install commitlint --edit "$1"

package.json添加代码

  "husky": {"hooks": {"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"}},

提交方式

1,手动使用commit

git commit -m 'feat(custom): 测试提交'

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

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

 "GitCommitPlugin.ShowEmoji":false,//去除commIt插件图标

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

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

.cz-config.cjs

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文字长度默认是72subjectLimit: 72}

在package.json中进行新增

"scripts": {"commit":"git cz"},  
"config": {"commitizen": {"path": "node_modules/cz-customizable"},"cz-customizable": {"config": ".cz-config.cjs"}},

执行npm 中的commit脚本

这篇关于vue3+vite+ts 配置commit强制码提交规范配置 commitlint的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/693060

相关文章

浅谈配置MMCV环境,解决报错,版本不匹配问题

《浅谈配置MMCV环境,解决报错,版本不匹配问题》:本文主要介绍浅谈配置MMCV环境,解决报错,版本不匹配问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录配置MMCV环境,解决报错,版本不匹配错误示例正确示例总结配置MMCV环境,解决报错,版本不匹配在col

Nginx中配置HTTP/2协议的详细指南

《Nginx中配置HTTP/2协议的详细指南》HTTP/2是HTTP协议的下一代版本,旨在提高性能、减少延迟并优化现代网络环境中的通信效率,本文将为大家介绍Nginx配置HTTP/2协议想详细步骤,需... 目录一、HTTP/2 协议概述1.HTTP/22. HTTP/2 的核心特性3. HTTP/2 的优

Vue3使用router,params传参为空问题

《Vue3使用router,params传参为空问题》:本文主要介绍Vue3使用router,params传参为空问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录vue3使用China编程router,params传参为空1.使用query方式传参2.使用 Histo

Python 安装和配置flask, flask_cors的图文教程

《Python安装和配置flask,flask_cors的图文教程》:本文主要介绍Python安装和配置flask,flask_cors的图文教程,本文通过图文并茂的形式给大家介绍的非常详细,... 目录一.python安装:二,配置环境变量,三:检查Python安装和环境变量,四:安装flask和flas

CSS Padding 和 Margin 区别全解析

《CSSPadding和Margin区别全解析》CSS中的padding和margin是两个非常基础且重要的属性,它们用于控制元素周围的空白区域,本文将详细介绍padding和... 目录css Padding 和 Margin 全解析1. Padding: 内边距2. Margin: 外边距3. Padd

CSS will-change 属性示例详解

《CSSwill-change属性示例详解》will-change是一个CSS属性,用于告诉浏览器某个元素在未来可能会发生哪些变化,本文给大家介绍CSSwill-change属性详解,感... will-change 是一个 css 属性,用于告诉浏览器某个元素在未来可能会发生哪些变化。这可以帮助浏览器优化

CSS去除a标签的下划线的几种方法

《CSS去除a标签的下划线的几种方法》本文给大家分享在CSS中,去除a标签(超链接)的下划线的几种方法,本文给大家介绍的非常详细,感兴趣的朋友一起看看吧... 在 css 中,去除a标签(超链接)的下划线主要有以下几种方法:使用text-decoration属性通用选择器设置:使用a标签选择器,将tex

前端高级CSS用法示例详解

《前端高级CSS用法示例详解》在前端开发中,CSS(层叠样式表)不仅是用来控制网页的外观和布局,更是实现复杂交互和动态效果的关键技术之一,随着前端技术的不断发展,CSS的用法也日益丰富和高级,本文将深... 前端高级css用法在前端开发中,CSS(层叠样式表)不仅是用来控制网页的外观和布局,更是实现复杂交

Python将博客内容html导出为Markdown格式

《Python将博客内容html导出为Markdown格式》Python将博客内容html导出为Markdown格式,通过博客url地址抓取文章,分析并提取出文章标题和内容,将内容构建成html,再转... 目录一、为什么要搞?二、准备如何搞?三、说搞咱就搞!抓取文章提取内容构建html转存markdown

在React中引入Tailwind CSS的完整指南

《在React中引入TailwindCSS的完整指南》在现代前端开发中,使用UI库可以显著提高开发效率,TailwindCSS是一个功能类优先的CSS框架,本文将详细介绍如何在Reac... 目录前言一、Tailwind css 简介二、创建 React 项目使用 Create React App 创建项目