css - 使用 ANTLR 解析 CSS - 边缘情况

Question

我正在尝试使用 ANTLR 解析 CSS，或者至少是基础知识。不过，我的词法分析器规则遇到了一些问题。问题在于 ID 选择器和十六进制颜色值之间的歧义。为清楚起见，使用简化的语法，请考虑以下输入:

#bbb {
  color: #fff;
}

和以下解析器规则:

ruleset : selector '{' property* '}';
selector: '#' ALPHANUM;
property: ALPHANUM ':' value ';' ;
value: COLOR;

和这些词法分析器标记:

ALPHANUM : ('a'..'z' | '0'..'9')+;
COLOR : '#' ('0'..'9' | 'a'..'f')+;

这不会起作用，因为 #bbb 被标记为 COLOR 标记，即使它应该是一个选择器。如果我将选择器更改为不以十六进制字符开头，它就可以正常工作。我不确定如何解决这个问题。有没有办法告诉 ANTLR 在特定位置仅将特定标记视为 COLOR 标记？比如说，如果它在属性规则中，我可以放心地假设它是一个颜色标记。如果不是，则将其视为选择器。

如有任何帮助，我们将不胜感激!

---

解决方案:原来我试图在语法中做太多事情，我可能应该在使用 AST 的代码中处理这些问题。 CSS 有太多不明确的标记，无法可靠地拆分成不同的标记，所以我现在使用的方法基本上是标记特殊字符，如“#”、“.”、“:”和大括号，并在消费者代码。工作得更好，并且更容易处理边缘情况。

Answer 1

尝试将词法分析器文件中的 # 从 COLOR 移动到它自己的东西，这样:

LLETTERS: ( 'a'..'z' )
ULETTERS: ( 'A'..'Z' )
NUMBERS: ( '0'..'9' )
HASH : '#';

然后，在您的解析器规则中，您可以这样做:

color: HASH (LLETTERS | ALPHANUM)+;
selector: HASH (ULETTERS | LLETTERS) (ULETTERS | LLETTERS | NUMBERS)*;

等等

这使您可以指定语法上的差异，这可以粗略地描述为上下文，与词汇上的差异，可以粗略地描述为外观。如果某物的含义根据它所在的位置而改变，则应该在语法中指定该差异，而不是词法分析器。

请注意，颜色和选择器的定义完全相同。词法分析器通常是与将输入字符串转换为语法的模块分开的阶段，因此有歧义的词典是无效的(正如所指出的，bbb 可以是十六进制，也可以是小写字母字符串)。因此，数据有效性检查需要在别处进行。