husky安装与配置

简介

        在团队协作中，往往需要使用到git来进行代码版本的管理，然而在执行提交命令之前，我们需要执行一些格式化操作（esLint、styLelint、prettier等），每次提交都手动执行这些，显然是浪费时间的，如果想在 git 执行命令前，自动执行格式化，那么就需要用到husky

安装配置

1.安装Husky

Husky官网https://typicode.github.io/husky/get-started.html

由于未知原因，只能用npm来安装配置husky（yarn/pnpm会报错）

# 安装依赖
npm install --save-dev husky
# 初始化
npx husky init

2.lint-staged

执行完初始化会在项目根目录生成.husky文件夹。安装lint-staged

pnpm install -D lint-staged

3.package.json

在package.json的scripts下中添加如下代码：

{
  // 添加 lint:lint-staged 命令
  "scripts": {
    "lint:lint-staged": "lint-staged",
  },
  // lint-staged 配置
  "lint-staged": {
    "*.{js,jsx,ts,tsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "{!(package)*.json,*.code-snippets,.!(browserslist)*rc}": [
      "prettier --write--parser json"
    ],
    "package.json": [
      "prettier --write"
    ],
    "*.vue": [
      "eslint --fix",
      "prettier --write",
      "stylelint --fix"
    ],
    "*.{scss,less,styl,html}": [
      "stylelint --fix",
      "prettier --write"
    ],
    "*.md": [
      "prettier --write"
    ]
  }
}

4.pre-commit

 在.husky → pre-commit文件中添加想要执行的命令

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

npm run lint:lint-staged

接下来可以进行提交了，提交前会自动对代码进行校验！