技术分享
首页
  • JavaScript

    • 构造函数和原型
    • Cookie和Session
    • Object.create(null)和{}
    • TypeScript配置
    • typescript入门到进阶
  • 框架

    • Vue-Router
    • React基础入门
  • 其它

    • Http协议
    • 跨域问题总结
  • 分析Promise实现
  • Axios源码分析
  • Webpack原理
  • vueRouter源码分析
  • Vue

    • Vite快速搭建Vue3+TypeScript项目
    • Cordova打包Vue项目的问题
    • Vue将汉字转为拼音,取出首字母
    • h5项目问题总结
  • JavaScript

    • new Function
  • 后端

    • Node.js中使用Crypto生成Token
    • Body-Parser处理多层对象的问题
  • 其它

    • 项目Demo汇总
    • Vuepress+Vercel搭建个人站点
    • 项目中能用到的
    • husky规范代码提交
  • Mongoose基础
  • Multer文件上传中间件的使用
  • JavaScript

    • 浅谈两数全等
    • JavaScript进制转换
    • 手写bind,apply,call和new
  • 算法

    • 数组去重和排序
    • 数组扁平化
    • 斐波那契数列
  • JavaScript 数据结构
  • 其它

    • webpack面试题
    • vite面试题
    • svg和canvas的优缺点
    • TypeScript面试题
    • Vue常见面试题
  • 计算机网络

    • 数据链路层
    • 网络层
  • Git的使用
  • Nginx的使用
  • CentOS7安装Nginx
  • 正则表达式
  • SEO搜索引擎优化
  • Serverless介绍
友链
GitHub (opens new window)

刘誉

总有人要赢,为什么不能是我
首页
  • JavaScript

    • 构造函数和原型
    • Cookie和Session
    • Object.create(null)和{}
    • TypeScript配置
    • typescript入门到进阶
  • 框架

    • Vue-Router
    • React基础入门
  • 其它

    • Http协议
    • 跨域问题总结
  • 分析Promise实现
  • Axios源码分析
  • Webpack原理
  • vueRouter源码分析
  • Vue

    • Vite快速搭建Vue3+TypeScript项目
    • Cordova打包Vue项目的问题
    • Vue将汉字转为拼音,取出首字母
    • h5项目问题总结
  • JavaScript

    • new Function
  • 后端

    • Node.js中使用Crypto生成Token
    • Body-Parser处理多层对象的问题
  • 其它

    • 项目Demo汇总
    • Vuepress+Vercel搭建个人站点
    • 项目中能用到的
    • husky规范代码提交
  • Mongoose基础
  • Multer文件上传中间件的使用
  • JavaScript

    • 浅谈两数全等
    • JavaScript进制转换
    • 手写bind,apply,call和new
  • 算法

    • 数组去重和排序
    • 数组扁平化
    • 斐波那契数列
  • JavaScript 数据结构
  • 其它

    • webpack面试题
    • vite面试题
    • svg和canvas的优缺点
    • TypeScript面试题
    • Vue常见面试题
  • 计算机网络

    • 数据链路层
    • 网络层
  • Git的使用
  • Nginx的使用
  • CentOS7安装Nginx
  • 正则表达式
  • SEO搜索引擎优化
  • Serverless介绍
友链
GitHub (opens new window)
  • 项目 Demo 汇总
  • node中使用crypto生成token
  • new Function
  • body-parser处理多层对象的问题
  • Vite快速搭建Vue3+TypeScript项目
  • Cordova打包Vue项目的问题
  • Vue将汉字转为拼音,取出首字母
  • 项目中能用到的
  • Vuepress+Vercel搭建个人站点
  • husky规范代码提交
    • v7.0.0 使用
      • 安装
      • 添加 git 钩子
  • h5项目问题总结
  • vue动态换行,行末省略
  • mocks项目复盘
  • 项目
coderly
2021-07-17

husky规范代码提交

# husky规范代码提交

  • 当您提交或推送时,您可以使用它来 lint 提交消息、运行测试、lint 代码等。
  • Husky 支持所有 Git 钩子。
  • husky (opens new window)

# v7.0.0 使用

  1. 暂不讨论其它版本
  2. 这个版本和v4不同的区别在于 该版本不需要在 package.json 中添加
// package.json 中不需要添加下面代码
"husky": {
  "hooks": {
    "pre-commit": "npm run test", // 在commit之前先执行npm run test命令
    "commit-msg": "commitlint -e $HUSKY_GIT_PARAMS" // 校验commit时添加的备注信息是否符合我们要求的规范
  }
}
1
2
3
4
5
6
7

# 安装

  1. npm install husky@7.0.0 -D
  2. npx husky-init,运行之后会新增一个 .husky 目录,同时在 package.json 中的 script 对象中新增一条 "prepare": "husky install"的命令
  3. npm install

# 添加 git 钩子

# pre-commit

项目要使用 git 进行代码提交时

  1. npx husky add .husky/pre-commit 'npm run test'
  2. 其实不推荐这种新增的写法,正确写法应该分两步进行,如下:
  3. npx husky add .husky/pre-commit,.husky 目录中新增一个 pre-commit 文件
  4. 修改 pre-commit 文件的内容
# pre-commit 文件

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npm run lint:fix # 修改这里,上面的内容一般不需要动
1
2
3
4
5
6

# commit-msg

验证提交信息是否符合规范

  1. npx husky add .husky/commit-msg 'npx --no-install commitlint --edit "$1"',经测试,这样会报错;这时应该分两步来完成
  2. npx husky add .husky/commit-msg,在 .husky 目录下新建一个 commit-msg 文件
  3. 打开 .husky/commit-msg 文件修改其内容
# commig-msg 文件

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npx --no-install commitlint --edit $1 # 你要修改的信息
1
2
3
4
5
6
  1. 安装commitlint:npm install @commitlint/cli @commitlint/config-conventional -D
    1. commitlint官网 (opens new window)
  2. 根目录新增 commitlint.config.js 文件,内容如下:
// commitlint.config.js

module.exports = {
  extends: ['@commitlint/config-conventional']
}
1
2
3
4
5

至此就配置好了

上次更新: 2021/08/08, 09:23:46
Vuepress+Vercel搭建个人站点
h5项目问题总结

← Vuepress+Vercel搭建个人站点 h5项目问题总结→

最近更新
01
代码片段
04-22
02
koa全家桶
03-29
03
mocks项目复盘
03-29
更多文章>
Theme by Vdoing | Copyright © 2021-2022 coderly | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式