将CSS变量转换为SCSS变量

Question

我正在将我的所有CSS文件更改为SCSS。但是，我需要将所有样式文件的css变量转换为csss变量。

有没有一种方法可以执行此操作而无需进入每个文件并使用查找和替换？我正在使用VS代码，就像想使用查找和替换正则表达式一样。但是我无法使其正常工作。

\(.*?\)i

例如，转换

// css 
.blog {
  box-shadow: var(--lightShadow);
  transition: var(--mainTransition);
}

进入

// scss
.blog {
  box-shadow: $lightShadow;
  transition: $mainTransition;
}

Answer 1

您可以使用

查找内容：\bvar\(--(\w+)\)（或\bvar\(--([^()]+)\)）
替换为：$$$1

详细信息

• \b-单词边界
• var\(---var(--字符串
• (\w+)-第1组：1个以上的字母，数字或下划线（[^()]+匹配1个以上的字符，而不是(和)）
• \)-一个)字符。

$$$1替换为美元符号和组1中的值。

演示：