I'm currently setting up VS Code for Python development. I'd like to have triple-quoted docstrings highlighted as comments, not as strings, i.e. grey instead of light green in this picture:
I know that I can adjust this in the TextMate rules for this theme, but I can't figure out the right scope for Python docstrings. I thought I would be something like this:
"editor.tokenColorCustomizations": {
"[Predawn]": {
"comments": "#777777",
"textMateRules": [
{
"scope": "string.quoted.triple",
"settings": {
"foreground": "#777777"
}
}
]
},
}
but that does not have the desired effect, even after restarting the editor. Does anyone know what the right scope is?
Just to expand on the comments above, the scopes are:
For docstrings: string.quoted.docstring.multi.python for """ ''' (or .single for ' ")
For triple quote strings that are not docstrings: string.quoted.multi.python
The scope string.quoted.triple is not used, even though it appears in settings.json autocomplete.
Try using this one
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": [
"string.quoted.multi.python",
"string.quoted.double.block.python",
"string.quoted.triple",
"string.quoted.docstring.multi.python",
"string.quoted.docstring.multi.python punctuation.definition.string.begin.python",
"string.quoted.docstring.multi.python punctuation.definition.string.end.python",
"string.quoted.docstring.multi.python constant.character.escape.python"
],
"settings": {
"foreground": "#777777" //change to your preference
}
}
]
Related
I'm trying to customize my VSCode theme using textMateRules. What I want to do is to change the color class names, but not all of them, only specific ones.
For example, in the project I'm working in, we have classes: A, B, C, D ...
A and B are "special" classes and I would like to highlight them differently (let say in red). This is what I added for now in my setting.json file:
{
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "entity.name.type.class",
"settings": {
"foreground": "#FF0000",
}
},
]
},
}
But it is highlighting all the classes names (including C, D and all the others).
Is there a way to add more rules to the scope, like a regexp match?
As recommended by #rioV8 I used the Highlight extension:
And I added this in my setting.json:
{
"highlight.regexes": {
"(A|B)": {
"decorations": [
{
"color": "red"
},
]
}
},
}
I'm trying to change the color of the word after import in JS, in VS Code. I attached a screenshot of what I mean.
Screenshot:
What I'm referring to is underlined in red
I didn't find a valid entry in the textMateRules for this.
I'd appreciate some help. Thanks :)
I don't know which flavor of javascript you are using but you can use the following in your settings.json:
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "variable.other.readwrite.alias.js",
"settings": {
"foreground": "#FF0000"
}
}
]
}
How to know which scopes a given token has
In your command palette type:
> Developer: Inspect Editor Tokens and Scopes
This will show a popup of information related to the token at cursor:
You will see applicable scope entries at the bottom for textmate scopes, you can use any of the options listed, but the topmost option is the most specfic option
If you use the Inspect Editor Tokens and Scopes command (from the Command Palette) you will see this scope:
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "variable.other.readwrite.alias.js.jsx",
"settings": {
"foreground": "#ff0000",
"fontStyle": "bold underline"
}
},
]
},
You cannot add a colored underline without also changing the font color also.
If you really want to color the line differently than the text (and many other formatting options, see https://code.visualstudio.com/api/references/vscode-api#DecorationRenderOptions
use the Highlight extension:
"highlight.regexes": {
"(import\\s+)(.*?)(\\s+from .*)": {
"filterLanguageRegex": "javascriptreact",
"decorations": [
{},
{
"borderWidth": "0 0 2px 0",
"borderColor": "red",
"borderStyle": "solid"
}
{}
]
}
},
LOL: you probably just wanted to change the word color, not the underlining. Nevertheless, the Highlight extension gives you many more options, like outlines, borders, backgroundColor, letterSpacing, even before and after css properties - so you can easily make the text you want to stand out.
I'm trying to get as comfortable as possible with this new IDE (coming from Visual Studio Community for Windows).
I used a very specific color theme that allowed me to understand the parts of the code at a glance. With VS Code though, it's more complicated for me as there aren't many options in the:
Settings > editor.tokenColorCustomizations.
Is there a way to colorize the #region pre-processor directives with a specific color?
Thanks.
Yes, it seems it has a distinct scope name (keyword.preprocessor.region), allowing you to target it with the setting, as the Developer: Show TM Scopes command shows:
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "keyword.preprocessor.region.cs",
"settings": {
"foreground": "#FF0000"
}
},
{
"scope": "keyword.preprocessor.endregion.cs",
"settings": {
"foreground": "#FF0000"
}
}
]
}
It seems the scope includes neither the # nor the string though:
Most of the other methods in the language api, such as analyze_syntax, analyze_sentiment etc, have the ability to return the constituent elements like
sentiment.score
sentiment.magnitude
token.part_of_speech.tag
etc etc etc....
but I have not found a way to return name and confidence in isolation from classify_text. It doesn't look like it's possible but that seems weird. Am missing something? Thanks
The language.documents.classifyText method returns a ClassificationCategory object which contains name and confidence. If you only want one of the fields you can filter by categories/name or categories/confidence. As an example I executed:
POST https://language.googleapis.com/v1/documents:classifyText?fields=categories%2Fname&key={YOUR_API_KEY}
{
"document": {
"content": "this is a test for a StackOverflow question. I get an error because I need more words in the document and I don't know what else to say",
"type": "PLAIN_TEXT"
}
}
Which returns:
{
"categories": [
{
"name": "/Science/Computer Science"
},
{
"name": "/Computers & Electronics/Programming"
},
{
"name": "/Jobs & Education"
}
]
}
Direct link to API explorer for interactive testing of my example (change content, filters, etc.)
TLDR; How can I have an extension colorize the syntax the extension is defining without it actually being a color theme the user has to enable?
I'm attempting to port this Sublime Text plugin (ToDone) to VSCode.
It creates a grammar for todo lists and then uses syntax highlighting to emphasize important tasks, mute completed tasks, etc.
I found "editor.tokenColorCustomizations", via Customize a Color Theme. It works with the new syntax when I use it in my user settings, but fails when I use it in the package.json#contributes portion of the extension manifest.
{
"contributes": {
"languages": [
{
"id": "todone",
"aliases": [
"ToDone",
"To-Done"
],
"extensions": [
".todone",
".todo"
]
}
],
"grammars": [
{
"language": "todone",
"scopeName": "text.todone",
"path": "./todone.tmLanguage"
}
],
"configurationDefaults": {
"[todone]": {
"editor.insertSpaces": false,
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "symbol.definition.task-heading.todone",
"settings": {
"foreground": "#ff8800"
}
}
]
}
}
}
}
}
So far, the syntax seems ok — it's exactly what is being used by the Sublime plugin and the colors from the user-settings are applied correctly. Also, the format of the settings seems ok because "editor.insertSpaces" is being applied and the colors are working when present in the user-settings.
Lastly, I get a very disappointing 'Warning' 'Unknown editor configuration setting' message on the "editor.tokenColorCustomizations" setting in the extension package.json.
So, sounds like this setting is not enabled for extensions?
Another possible route I saw was to use decorators. But, I didn't see anything on inspecting the syntax tokens associated with a portion of text in the docs, e.g. some way to iterate through the syntax tokens of the document to apply decorators. So, the decorator route sounds like the hard-way compared to "editor.tokenColorCustomizations".
Any suggestions on how to make this work would be greatly appreciated.
Edit: The code, so far, is on GitHub: tiffon/vscode-todone
It only fails if you specify a specific language. It is working for me if I do not specify the todone extension.
"configurationDefaults": {
"editor.insertSpaces": false,
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "symbol.definition.task-heading.todone",
"settings": {
"foreground": "#ff8800"
}
}
]
}
}