husky应用git commit时候检测console.log debugger alert 禁止提交

背景:
最近做的vue 项目要求,提交代码时候,带有 console debugger alert 线上发布不成功,但是每次写完就提交了,负责人发布时候发布不成功才发现代码里有这些,然后在删再提,很麻烦.所以查阅资料解决这个问题,提交代码时候做个检测.
利用git 的生命周期 ,commit 时候进行检测. 以下是现实过程.

1.安装依赖

npm install pre-commit --save-dev
npm instal husky --save-dev

2.在package.json中添加执行代码

 "scripts": {
    "check-keyword": "bash ./hooks/check-keyword.sh"
    "precommit":"npm run check-keyword"
  },
  "pre-commit": [
    "precommit"
  ],

注意这句

image.png

这里等下第三步完成后提交代码时候git 会报一个提示,安照提示执行命令就可以了.你可以先跳过这里的内容,先进行第三步,遇到问题再看这里.

image.png

然后命令行执行:

image.png

然后你会发现这句代码在package.json 中消失了,下次再提交时候husky插件会自动运行.

3. 需要在项目根目录下, 新建hooks/check-keyword.sh, 代码如下

#!/bin/bash

red=`tput setaf 1`
green=`tput setaf 2`
reset=`tput sgr0`
# echo "${red}red text ${green}green text${reset}"

echo  "${green}start checking keyword${reset}"


for FILE in `git diff --name-only --cached`; do

    if [[ $FILE == *".sh"* ]] || [[ $FILE == *"vendor/*"* ]] ||[[$FILE == *"node_modules/*"*]]||[[$FILE == *"public/*"*]]; then
        echo $FILE
        continue
    fi
    grep 'TODO:\|debugger\|console.log\|alert(' $FILE 2>&1 >/dev/null
    if [ $? -eq 0 ]; then
        echo $FILE '包含，TODO: or debugger or console.log，请删除后再提交'
        exit 1
    fi
    
done
exit

4. 我们可以 在一个业务js 里写一个 console.log 或是 debugger 测试一下.看看是否生效

   
   
   image.png

检测到了 这个组件里含有.处理完毕！

注意：
这份配置，提交到代码仓库，下次有新同事新拉代码下来，安装好依赖，写代码首次提交后，会出现的问题：

image.png

这个时候，需要在package.json 中加上这句，再提交。

"precommit":"npm run check-keyword"

image.png

====================================

Linux shell 大意解读:
echo 输出

grep
grep 命令用于查找文件里符合条件的字符串。

git-diff
git-diff - 显示两次提交的变化的部分