vue2旧项目引入husky+lint-staged配置代码提交规范

前言：项目是两年前建立的，试着引入husky最新版，失败了。所以还是引入旧版husky（4.x及之前的版本），以下是项目已引入的插件版本。我使用的node是12.19.0版本

"vue": "2.6.10"

"eslint": "5.15.3"

 "babel-eslint": "10.0.1"

 "eslint-plugin-vue": "^5.2.2"

配置husky和lint-staged

安装：npm install husky@4.1.0 -D （我选的这个版本）

           npm install lint-staged@9.5.0 -D 

配置 ：在package.json文件里配置：

"scripts":{

        "lint": "eslint --fix --ext .js,.vue src",

        "lint-staged": "lint-staged"

},

 "husky": {

    "hooks": {

      "pre-commit": "lint-staged"

    }

  },

  "lint-staged": {

    "*.{js,vue}": [

      "eslint --fix",

      "git add"  // 只校验缓存区

    ]

  }

配置prettier

（1）安装依赖如下：

npm install prettier@1.18.2 -D

npm install eslint-plugin-prettier@3.1.0 -D （调用prettier对你的代码风格进行检查）

npm install @vue/eslint-config-prettier@5.0.0 -D (解决eslint 和prettier的冲突)

（2）在根目录下新建一个.prettierrc.js文件，配置如下：

// 在这里统一格式

module.exports = {

  singleQuote: true, // 强制单引号

  endOfLine: 'lf',

  htmlWhitespaceSensitivity: 'ignore',

  semi:false,// 不加分号

  trailingComma:'none',// 结尾处不加逗号

};

（3）在.eslintrc.js文件里写入配置（我只改了extends）：

 extends: ['plugin:vue/essential', '@vue/prettier']

到这里，就配置完成了，可以尝试修改一个不符合校验规则的文件，然后commit试下。此配置在commit时会自动修复（比如格式），不能修复的就会出现如下的错误，点击显示命令输出，根据错误提示修改就好了。

遇到的问题：

（1）pre-commit不触发

由于我在本地调试，安装了很多次husky（包含新版），项目目录下.git/config的文件里加了一行

hooksPath = .husky，手动删除这行就能触发了

（2）如果在提交代码遇到如下错误提示，可以试着更新一下git。