规范化之husky(哈士奇) + lint-staged

前言：

好的commit message对于程序员来说绝对是延年益寿的存在,对于项目开发效率和代码回溯都有很大的帮助，这就是我为什么要在项目中极力推进的一个要点。对于规范 commit msg 的两个插件,一个是 husky 中文音译“哈士奇”，一个是 commitlint,看本文标题并没有 commitlint 而多了一个lint-staged插件，本文主要是接上一篇文章“前端项目工程化之规范代码风格”。在网上看到一篇技术博客说得非常到位 husky 就是为了防止写得像[屎]一样的代码被提交到远程仓库。lint-staged 的作用主要是用于项目使用 prettier +eslint 检测代码的时候只对执行过 git add 的代码进行校验，降低校验时效。

入职公司以来接手了几个烂摊子，看别人的代码是真的难受，尤其是写得像[屎]一样的代码看得更是难受。所以，在最近工作任务不多的闲暇时间下，决心定制前端代码规范并在公司推动前端代码规范落地。

husky

描述：husky是一个Git Hook工具,可在 git 执行某些点触发动作。

常用Hook

1、pre-commit（预先提交）

这个钩子由git commit调用，可以使用 --no-verify选项绕过它。

2、commit-msg（提交信息） 这个钩子由git commit和git merge调用，可以使用--no-verify选项绕过。它接受一个参数，及保存建议的提交日志消息的文件的名称。退出非零状态会导致命令中止。

备注：commit-msg是配合commitlint使用的本文不过多说明。

安装依赖

npm install --save-dev husky --registry=https://registry.npm.taobao.org

lint-staged

描述：引入 lint-staged 的目的是只对 git add 缓存区的代码进行 prettier + eslint 代码规范校验，避免全局校验。

安装依赖

npm install --save-dev lint-staged --registry=https://registry.npm.taobao.org

package.json配置

"husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
},

"lint-staged": {
    "src/**/*.{js, vue}": [
      "prettier --write",
      "eslint --fix"
    ]
},

修改的代码先执行 git add fileName,然后执行 git commit -m 'feat(): xxx' ，这时会先执行 lint-staged,校验提交代码是否符合 prettier + eslint 规范，不符合会先进行修复，不能自动修复的。中断 commit 提交。