hasky+commitlint+lint-staged+eslint配置总结

278 阅读1分钟

a3vDd8hzuYs.jpg

前言

在做前端工程化时husky可以说是一个必不可少的工具。husky可以让我们向项目中方便添加git hooks。

安装包版本

"lint-staged": "^13.2.2",
"husky": "^8.0.3",
"@commitlint/cli": "^17.6.6",
"@commitlint/config-conventional": "^17.6.6",

正文配置

1.安装huskyhusky官网

npm install husky --save-dev

2.启动hook

npx husky install

  1. 安装后启用挂钩

    package.json

{
  "scripts": {
    "prepare": "husky install" 
  }
}

npm run prepare // 首次执行

  1. 创建提交前校验eslint hook(eslint需要提前配置)

// 只校验当前提交的文件 不是校验全部文件
npx husky add .husky/pre-commit "npx lint-staged"

// 执行命令下载对应的包
npm i lint-staged -D

package.json添加

{
  "lint-staged": {
    "*.{js,jsx,tsx,ts,vue}": [
      "eslint --fix"
    ]
  }
}

现在在commit的时候就能校验eslint了

  1. 创建提交前commit格式校验
// 只校验当前提交的文件 不是校验全部文件
npx husky add .husky/commit-msg 'npx --no-install commitlint --edit "$1"'

// 执行命令下载对应的包
npm i @commitlint/cli @commitlint/config-conventional  -D

新建commitlint.config.cjs配置文件

module.exports = {
  extends: ['@commitlint/config-conventional'],
  rules: {
    // type 类型定义,表示 git 提交的 type 必须在以下类型范围内
    'type-enum': [
      2,
      'always',
      [
        'feat', // 新功能
        'fix', //  修复
        'docs', // 文档变更
        'style', // 代码格式(不影响代码运行的变动)
        'refactor', // 重构(既不是增加feature),也不是修复bug
        'pref', // 性能优化
        'test', // 增加测试
        'chore', // 构建过程或辅助工具的变动
        'revert', // 回退
        'build' // 打包
      ]
    ],
    // subject 大小写不做校验
    'subject-case': [0]
  }
}

现在提交时就能校验commit格式了