css - 匹配css url的正则表达式

Question

我有正则表达式

/url\\(\\s*(?!data:)([^\\)\\s]+)\\s*\\)?/

它在 css 中搜索这样的行

background-image: url(/path.to/img.png);

并忽略线条

background-image: url(data:image/svg+xml;base64, PHN2ZyB4bWxucz) no-repeat;

它用于查找图像路径并替换它们。

但是如果数据 url 有引号

background-image: url("data:image/svg+xml;base64, PHN2ZyB4bWxucz") no-repeat;

正则表达式匹配它。我需要匹配通常的图像 url 并忽略带单引号、双引号或不带它们的数据 url。

Answer 1

url\\(\\s*(?!["']?data:)([^)]+)\\)

在这个正则表达式中，它将忽略下面的任何内容（接受可选空格后(

url("data...
url(data:...

这意味着它只会匹配您在该问题上给出的第一个示例。

Answer 2

尝试使用模式("|')?：

/url\\(("|')?\\s*([^(:;,]+)\\s*("|')?\\);?/

("|')?还允许您匹配单引号或双引号