Question

我正在使用Sublime Text 3中的AngluarJS Web应用程序，我需要能够在某些指令中输入布尔表达式，例如ng-show，ng-class来定义某些显示属性的条件。 Sublime将布尔运算符视为无效，并以粉红色突出显示（无效语法）。

以下是一个例子：

<div ng-hide="line.valid && $index == 0"> ... </div>

在此示例中，&&突出显示为粉红色，因为它不应出现在Sublime逻辑中的HTML中。同样适用于||。

有没有办法编辑语法高亮文件，以便在除布尔运算符之外的所有内容上保持无效的语法高亮？

我见过ways to change the color of the highlighting altogether，但我真的很想让Sublime意识到这些运算符可以在HTML中使用，所以我仍然能够突出显示其他不良代码。

Answer 1

问题是HTML的语法定义假设“＆amp;”或“＆amp;＆amp;”无效（“||”没有问题），因此粉红色突出显示。我稍微调整一下来解决你的问题。如果您想了解具体方法，请阅读以下代码。否则请跳过。

之前，string.quoted.double.html包含entities，其匹配为无效“＆amp;＆amp;”。

repository:
...
  entities:
    patterns:
    - captures:
        '1': {name: punctuation.definition.entity.html}
        '3': {name: punctuation.definition.entity.html}
      match: (&)([a-zA-Z0-9]+|#[0-9]+|#x[0-9a-fA-F]+)(;)
      name: constant.character.entity.html
    - {match: '&', name: invalid.illegal.bad-ampersand.html}
...
  string-double-quoted:
    begin: '"'
    beginCaptures:
      '0': {name: punctuation.definition.string.begin.html}
    end: '"'
    endCaptures:
      '0': {name: punctuation.definition.string.end.html}
    name: string.quoted.double.html
    patterns:
    - {include: '#embedded-code'}
    - {include: '#entities'}

要解决此问题，我只是使用entities复制了string_entries条目并删除了＆符错误

repository:
...
  entities:
    patterns:
    - captures:
        '1': {name: punctuation.definition.entity.html}
        '3': {name: punctuation.definition.entity.html}
      match: (&)([a-zA-Z0-9]+|#[0-9]+|#x[0-9a-fA-F]+)(;)
      name: constant.character.entity.html
    - {match: '&', name: invalid.illegal.bad-ampersand.html}
  entities_string:
    patterns:
    - captures:
        '1': {name: punctuation.definition.entity.html}
        '3': {name: punctuation.definition.entity.html}
      match: (&)([a-zA-Z0-9]+|#[0-9]+|#x[0-9a-fA-F]+)(;)
      name: constant.character.entity.html
...
  string-double-quoted:
    begin: '"'
    beginCaptures:
      '0': {name: punctuation.definition.string.begin.html}
    end: '"'
    endCaptures:
      '0': {name: punctuation.definition.string.end.html}
    name: string.quoted.double.html
    patterns:
    - {include: '#embedded-code'}
    - {include: '#entities_string'}

这是HTML.sublime-package的{{3}}（它是一个zip，但您可以将后缀重命名为sublime-package）。您需要转到安装了ST3的默认包目录，并用这个新的HTML.sublime-package替换。{/ p>

如果链接过期，请发表评论。

Answer 2

这是一个快速解决方案，但如果有人有更好的解决方案，我全心全意。

转到Sublime Text > Preferences > Browse Packages。在HTML/HTML.tmLanguage中，注释掉以下代码块，如下所示（使用HTML注释）：

<!--
<dict>
  <key>match</key>
  <string>&amp;</string>
  <key>name</key>
  <string>invalid.illegal.bad-ampersand.html</string>
</dict>
-->

这将解决问题，但在将来的Sublime Text更新中会被覆盖。要解决这个问题，您可以复制Packages文件夹中的HTML文件夹，将其命名为HTMLAmpersandFix，然后在您的用户设置（Preferences > Settings - User）中添加：

"ignored_packages":
[
  "HTML",
  "Vintage"
],

我并不完全迷恋这个解决方案，因为我希望有一种方法可以在AngularJS包中修复它并将其作为拉取请求提交给它。对我来说，上面的解决方案对我来说已经足够了，但是我很想找到一个更好的解决方案。

注意：积分转到Alec的答案，让我走上正轨（虽然我不知道他的代码片段指的是什么文件，并且无法让他的下载链接工作），并且以下Stack Overflow问题用于回答如何覆盖HTML.tmLanguage的问题。 How do I edit HTML.tmLanguage in sublime on mac osx

Sublime：在AngularJS指令内的布尔运算符上禁用粉红色突出显示

2 个答案: