Is there a way to customize the color of the import in JS in VS Code? - syntax-highlighting

Question

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 :)

Answer 1

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

Answer 2

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.