CODEWITHSUNDEEP
sublimetext3syntax-highlightingsublimetext
Vael Victus
Vael Victus

Reputation: 4122

Highlight the jQuery $ variable in Sublime Text 3 (build 3103)

In Feb 2016, the update to build 3103 broke a custom theme of mine, mostly in regard to Javascript. I really miss the ability to target the $, it seems that it's now under the scope:

meta.function-call.with-arguments.js variable.function.js when modifying the theme.

I want to know if there's a way to bypass or over-rule the $ sign, perhaps some REGEX or a way to add scope into the .tmLanguage file, so that I may color it differently from other "variable functions".

Upvotes: 0

Views: 531

Answers (1)

Vael Victus
Vael Victus

Reputation: 4122

Until the unpaid/non-dev Sublime Text 3 is updated >= build 3106, follow these instructions to theme your $ variable in JavaScript or otherwise allow updated themes to function properly.

  1. On your computer, go to Sublime Text 3\Data\Packages and make a new folder named "JavaScript", exactly that.

  2. Visit https://github.com/sublimehq/Packages/blob/master/JavaScript/JavaScript.sublime-syntax

  3. Copy that text, save as JavaScript.sublime-syntax in your new JavaScript folder. This will update the grammar to accept $ as its own scope.

  4. You can now target variable.other.dollar.only.js and punctuation.dollar.js

Modifying Your Theme

Add this to your favorite theme if it hasn't been updated! Change the foreground to your liking.

<dict>
    <key>name</key>
    <string>jQuery $</string>
    <key>scope</key>
    <string>punctuation.dollar.js</string>
    <key>settings</key>
    <dict>
        <key>foreground</key>
        <string>#b3935cff</string>
    </dict>
</dict>

Upvotes: 2

Related Questions