如何用正则表达式替换CSS变量font属性值中的空格？

针对你需要移除-font:'XXX XXX'格式内容中单引号内空格的需求，提供以下几种适配不同场景的解决方案：

1. 通用文本编辑器方案（VS Code/Sublime Text等） #

适合不需要编程，直接在编辑器里批量替换的场景：

• 查找正则：(-font:'([^']*))\s+([^']*')
• 替换内容：$1$3
• 操作步骤：开启全局替换（勾选「匹配正则表达式」「全部替换」），重复点击替换直到没有匹配结果，即可移除单引号内所有空格。

2. 编程语言方案（JavaScript/Python等） #

如果需要在代码中处理字符串，以JavaScript为例：

const originalStr = `"data-template='Test xxx' root{--primary-font:'XYZ Sans';--secondary-font:'Test Sans';--hero-background:#ffbe3f;--header-colour-highlight:#f0591e;--header-background:#ffffff;--header-colour-tabs:#1d2130; }"`;
// 匹配所有-font:'...'结构，移除其中的空格
const processedStr = originalStr.replace(/(-font:'[^']*')/g, match => match.replace(/\s+/g, ''));
console.log(processedStr);

执行后输出结果：

"data-template='Test xxx' root{--primary-font:'XYZSans';--secondary-font:'TestSans';--hero-background:#ffbe3f;--header-colour-highlight:#f0591e;--header-background:#ffffff;--header-colour-tabs:#1d2130; }"

3. 单步替换方案（支持高级正则替换的工具） #

部分工具（如Perl、VS Code的高级替换）支持在替换时直接处理捕获组内容：

• 查找正则：(-font:')([^']*)'
• 替换内容（VS Code）：$1${2/\s//g}'
• 替换内容（Perl）：$1$2=~s/\s//gr'
  这种方案只需一次全局替换即可完成所有空格移除。

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