sublimetext3 - Sublime Text 3中的不同高亮JS和CSS

Question

我知道如何更改javascript和CSS突出显示的颜色。我将<array></array>之间的主题文件添加到我的 Activity tm中。

 <dict>

 <key>name</key>

 <string>Embedded source</string>

 <key>scope</key>

 <string>text source, string.unquoted</string>

 <key>settings</key>

 <dict>

 <key>background</key>

 <string>#804A7D99</string>

 </dict>

 </dict>

结果:

但是，如何使JS和CSS的背景变得多样化，以便在minimap上进行引导更方便？例如:

JS —蓝色

CSS —绿色

谢谢。

Answer 1

在tmTheme文件中包含以下代码，以处理混合的JS，CSS和HTML。

    <dict>
        <key>name</key>
        <string>JS_Source</string>
        <key>scope</key>
        <string>source.js.embedded.html</string>
        <key>settings</key>
        <dict>
            <key>background</key>
            <string>#2D6A73</string>
            <key>foreground</key>
            <string>#7B91B9</string>
        </dict>
    </dict>

    <dict>
        <key>name</key>
        <string>CSS_Source</string>
        <key>scope</key>
        <string>source.css.embedded.html, meta.attribute-with-value.style.html source.css</string>
        <key>settings</key>
        <dict>
            <key>background</key>
            <string>#2D7333</string>
            <key>foreground</key>
            <string>#7B91B9</string>
        </dict>
    </dict>

    <dict>
        <key>name</key>
        <string>HTML_Text</string>
        <key>scope</key>
        <string>text.html</string>
        <key>settings</key>
        <dict>
            <key>background</key>
            <string>#783727</string>
            <key>foreground</key>
            <string>#7B91B9</string>
        </dict>
    </dict>

正如 @KeithHall在注释中提到的，作用域的使用:

CSS:   source.css.embedded.html, meta.attribute-with-value.style.html source.css
JS:    source.js.embedded.html

将允许您将这些自定义背景色应用于 HTML语法，而不会影响 CSS和 JS语法。