Can I set editor.tokenColorCustomizations inside a VSCode extension?

Question

I'm working on a language support plugin for a proprietary language I use at work. We access properties of deeply nested objects a lot, e.g. This.isa.Really.Long.Variable.Name.ActualValue so the code gets really dense with these. My idea was to apply a TextMate scope to everything before the last dot and change the color to a partially transparent white so it fades into the background.

I've successfully added a rule in my editor settings to change the color of a TextMate scope that I created.

"editor.tokenColorCustomizations": {
  "textMateRules": [{
    "scope": "support.variable.long.myLang",
    "settings": {
      "foreground": "#ffffff90",
      "fontStyle": "italic"
    }
  }]
}

However, adding this rule to "configurationDefaults" in my extension doesn't work and it warns "Unknown editor configuration setting". I can set other editor settings just fine.

Is there a way to do this? Or is there already a TextMate scope that would generally correlate to faded out text? Or any other way to fade/hide part of a line in VScode?

Answer 1

It should be possible, here I give you an example of my extension, defining colors to my new scopes. Works correctly.

"contributes": {
    "configurationDefaults": {
      "editor.tokenColorCustomizations": {
        "textMateRules": [
          {
            "scope": "my-extension.constants",
            "settings": {
              "foreground": "#b180a9"
            }
          },
          {
            "scope": "my-extension.variables",
            "settings": {
              "foreground": "#2ebe82"
            }
          },
          {
            "scope": "my-extension.translations",
            "settings": {
              "foreground": "#64a1f1"
            }
          },
          {
            "scope": "my-extension.store",
            "settings": {
              "foreground": "#b3b6b9"
            }
          }
        ]
      }
    }
  }