visual-studio-codevscode-extensionstmlanguage

Matching of identifiers between tmLanguage and tmTheme files


I'm trying to understand how Visual Studio Code matches identifiers between theme and language files. For instance in one tmLanguage file I have a definition like this:

...
            <dict>
                <key>begin</key>
                <string>'</string>
                <key>beginCaptures</key>
                <dict>
                    <key>0</key>
                    <dict>
                        <key>name</key>
                        <string>punctuation.definition.string.begin.java-or-c</string>
                    </dict>
                </dict>
...

The dict contains the identifier punctuation.definition.string.begin.java-or-c to identify the start of the single quote string. Now looking in one of the tmThemes files I have, this identifier is never mentioned and in fact I can imagine that language file writers are free to use any identifier they want. But how can a theme be matched against them so that VS Code knows which color to apply? Is there somewhere a documentation describing the process?


Solution

  • Visual Studio Code obviously uses the styling approach from TextMate, hence much of what applies in TextMate (e.g. theme and language customization) is valid in VS Code as well. Matching is done similar like for CSS selectors, as this described in the Scope Selectors documentation. In short: theme files contain color values for certain scopes (e.g. those mentioned by DAXaholic). These are matched partially or fully against the scopes specified in the language file, e.g. a scope "string" matches all "string.quoted" scopes etc.

    Further reading, especially which scopes one should support in language + theme files, can be done on the page: Writing a TextMate Grammar: Some Lessons Learned, which also mentions a list of standard scopes.