05前端自动化规范工具 husky结合lint-staged提交检测

前端自动化规范工具 husky结合lint-staged提交检测

实现功能

• 提交代码前代码对代码进行检测

安装

$npm install --save-dev husky lint-staged

初始化

package.jsonscripts添加执行脚本

"prepare":"husky install"

添加后执行

npm run prepare

可以看到项目目录中自动生成了.husky 文件夹

添加git hooks

添加前置钩子

npx husky add .husky/pre-commit "npm-run-pre-commit"

.husky 文件夹中会生成pre-commit文件

可以看到npm-run-pre-commit就是我们要在提交前执行的npm命令，我们将命令替换成npm run pre-commit

配置操作

package.jsonscripts添加执行脚本

"pre-commit": "lint-staged"

加入lint-staged配置

"lint-staged": {
  "*.{js,ts,vue,jsx,tsx}": [
    "eslint --ext .js,.jsx,.ts,.tsx,.vue"
  ],
  "*.{css,scss}": [
    "stylelint"
  ],
  "*.{js,jsx,ts,tsx,md,html,css,lees,scss,sass}": "prettier --write"
},

这样我们就完成了所以配置，在提交代码时候会对要提交的代码进行检测