使用grep移除normalize.css的CSS注释失效，如何排查问题？

我来帮你拆解问题，以及给出可行的解决方案：

问题根源 #

你遇到的问题主要有两个核心原因：

1. grep默认的正则模式不兼容你的表达式
   你写的是扩展正则表达式（ERE），但grep默认用的是基础正则（BRE），像()、+这些元字符在BRE里是普通字符，必须转义才能生效，或者你得加-E参数启用ERE模式。但这只是小问题，更大的麻烦是——
2. grep默认逐行处理文本
   CSS里的注释很多是跨多行的，比如你示例里的/* Document ... */块，包含了好几行注释内容。grep只能一行一行扫描，没法识别这种跨行的注释块，所以注释里的每一行都不会被grep -v过滤掉，自然就保留在输出文件里了。

另外，你在regex101里测试的是单行模式下的匹配，但实际场景是多行注释，grep默认不支持跨行匹配（除非用-z把整个文件当一行处理，但这样逻辑会很复杂）。

可行的解决方案 #

推荐用sed来处理，它天生支持多行文本操作，专门适合这种移除注释的场景。

修改后的脚本 #

把你的Shell脚本替换成下面这段：

#!/usr/bin/env sh
normalize="node_modules/normalize.css/normalize.css"
if [[ -f "$normalize" ]]; then
  # 移除所有/* ... */格式的CSS注释，同时删除空行（不需要空行删除的话去掉第二个-e参数）
  sed -e 's/\/\*[^*]*\*\+\([^/*][^*]*\*\+\)*\///g' -e '/^[[:space:]]*$/d' "$normalize" > index.css
else
  echo "There is no normalize.css available."
fi

脚本说明 #

• 第一个sed表达式s/\/\*[^*]*\*\+\([^/*][^*]*\*\+\)*\///g：精准匹配并替换掉所有单行和多行的CSS注释，不管注释里有没有换行。
• 第二个表达式/^[[:space:]]*$/d：删除所有空行（如果希望保留空行，直接去掉这部分即可）。

验证结果 #

运行这个脚本后，你会得到期望的输出内容：

html { line-height: 1.15; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

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