Sublime Text 3 Highlighting Jquery Angular Syntax Issue

0
votes

After updating from Sublime Text 2 to Sublime Text 3, I have experienced some issues with the highlighting of variables mostly in the case of Angular or JQuery elements no longer having a highlight of pink (using Monokai theme; default)

Has anyone experienced this issue or know a way to resolve this?

enter image description here

1
sublimetext2sublimetext3sublime-text-plugin

1 Answers

2
votes

These variables have, with the normal javascript syntax, the scope variable.other.dollar.js. The scope variable and variable.other have no highlighting in the monokai colorscheme. If you want to add a highlighting on your own, you can just modify the colorscheme. To do this I would recommend the Package Resource Viewer. Just press ctrl+shift+p and select PackageResourceViewer: Open Resource and navigate to the monokai colorscheme. This will open the colorscheme xml file. If you save it, it will not change the existing one (which is read only in a zip folder), but create it in your Packages folder. This colorscheme will shadow the existing one. Add the following entry at a reasonable position and the variables should be highlighted pink:

<dict>
    <key>name</key>
    <string>JQuery Variable</string>
    <key>scope</key>
    <string>variable.other.dollar.js</string>
    <key>settings</key>
    <dict>
        <key>foreground</key>
        <string>#FF90FF</string>
    </dict>
</dict>

In general you can use the ScopeHunter to retrieve the scope and adapt the colorscheme to fit your requirements.