四、基于Vue3的开发-环境搭建-【husky】提交代码效验

1、需要先初始化项目

	git init 

2、初始化husky 项目

	pnpm dlx husky-init && pnpm install

3、安装lint-staged

	 pnpm i lint-staged -D

4、配置package.json文件

【1】需要配置效验命令 “lint-staged”: “lint-staged”
【2】需要配置效验文件类型 “lint-staged”

{
  "name": "vue-big-enven-project",
  "version": "0.0.0",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview",
    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore",
    "format": "prettier --write src/",
    "prepare": "husky install",
     //提交代码时候进行暂存区效验
    "lint-staged": "lint-staged"
  },
  "dependencies": {
    "@element-plus/icons-vue": "^2.3.1",
    "@vueup/vue-quill": "^1.2.0",
    "axios": "^1.7.3",
    "element-plus": "^2.8.0",
    "pinia": "^2.1.7",
    "vue": "^3.4.29",
    "vue-router": "^4.3.3"
  },
  "devDependencies": {
    "@rushstack/eslint-patch": "^1.8.0",
    "@vitejs/plugin-vue": "^5.0.5",
    "@vue/eslint-config-prettier": "^9.0.0",
    "eslint": "^8.57.0",
    "eslint-plugin-vue": "^9.23.0",
    "husky": "^8.0.0",
    "lint-staged": "^15.2.8",
    "pinia-plugin-persistedstate": "^3.2.1",
    "prettier": "^3.2.5",
    "sass": "^1.77.8",
    "unplugin-auto-import": "^0.18.2",
    "unplugin-vue-components": "^0.27.3",
    "vite": "^5.3.1"
  },
  
  //效验文件类型
  "lint-staged": {
    "*.{js,ts,vue}": [
      "eslint --fix"
    ]
  }
}

5、修改 .husky/pre-commit 文件

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
//执行的命令
pnpm lint-staged

6、说明

在执行 **git commit - m “说明修改内容”**的时候进行效验，自己编辑代码有误错误