Git预提交钩子：保存Bash变量同时实时显示yarn lint格式化输出

问题核心 #

需要在预提交钩子中同时实现两个需求：

1. 实时展示yarn lint的彩色、带格式原生输出
2. 捕获输出内容用于判断lint是否通过，且不重复执行yarn lint

之前的方案要么无法实时输出，要么输出丢失颜色、格式混乱，以下是两种可行的解决办法：

方案一：使用临时文件（简单直观） #

echo -e '\n🏃 Running "yarn lint"...'
cd web
# 强制输出颜色，用tee实时打印到终端的同时存入临时文件
yarn lint --color=always | tee /tmp/lint_output.tmp
# 从临时文件读取输出内容到变量
lintCheck=$(cat /tmp/lint_output.tmp)
# 清理临时文件
rm /tmp/lint_output.tmp

if [[ "$lintCheck" == *" No ESLint warnings or errors"* ]]; then
  echo "✅ Linting looks good!📚"
else
  echo "❌ Linting error ❌"
  exit 1
fi

方案二：使用Bash文件描述符（无需临时文件） #

利用Bash的文件描述符复制能力，直接将输出同时定向到终端和变量：

echo -e '\n🏃 Running "yarn lint"...'
cd web
# 复制stdout到文件描述符3，将yarn lint的输出同时打印到终端并捕获到变量
lintCheck=$(yarn lint --color=always 2>&1 | tee /dev/fd/3) 3>&1

if [[ "$lintCheck" == *" No ESLint warnings or errors"* ]]; then
  echo "✅ Linting looks good!📚"
else
  echo "❌ Linting error ❌"
  exit 1
fi

关键细节说明 #

1. --color=always参数：当yarn lint的输出被管道（|）处理时，工具会默认关闭颜色输出（检测到输出目标不是终端），该参数强制输出颜色转义序列，保证终端显示彩色内容。
2. tee的扩展用法：tee不仅能写入文件，还能写入文件描述符（如/dev/fd/3），结合Bash的文件描述符复制，即可实现同时输出到终端和捕获输出到变量。
3. 避免echo $lintCheck的问题：直接用$(...)配合tee捕获的输出会保留换行和颜色转义序列，而echo $lintCheck会把换行替换成空格，同时可能丢失颜色格式。

内容的提问来源于stack exchange，提问作者Rasmus