Answer a question

I have fresh install of VScode editor (v.1.14.2). Doesn't have any installed extensions. I have problem with javaScript highlighting in very simple file. js code in default VScode

The same code in Sublime Text 3:

js code in default ST3

Default VScode theme (Dark+), doesn't have this bug, and all function names and methods have the same colors. But many another themes (monokai and Abyss for example) have this bug/feature.

I want to have for function names and methods the same color (line 10, 11, 13, 16). Ideally, all lines like in ST3 - blue (line 13 - green). But, it's ok if it would be a green.

I read scope naming link, try to compare different themes. Install all monokai-based themes, but all of theme, has this bug. I tried to create new one, but I didn't do what I need.

So, does it possible to fix this?

Answers

You can use vscode command Developer: Inspect TM Scopes for scope inspection. This color changes because vscode thinks click(), addEventListener()... is special DOM-related properties and should be highlighted.

Workaround would be modifying monokai-color-theme.json in

Microsoft VS Code\resources\app\extensions\theme-monokai\themes.

In this array "tokenColors": [] add:

{
    "name": "DOM & invocation color fix",
        "scope": "meta.function-call.js entity.name.function, meta.function-call.js support.function.dom.js",
            "settings": {
        "foreground": "#66D9EF"
    }
}

This will make function calls & DOM-methods sublime-like.

P.S. If theme updates it will most likely overwrite this file.

Edit:

From some version it is possible to modify theme from settings.json Ctrl+,

"editor.tokenColorCustomizations": {
    "textMateRules": [
        {
            "scope": ["meta.function-call.js entity.name.function", 
                "meta.function-call.js support.function.dom.js"],
            "settings": {
                "foreground": "#66D9EF"
            }
        }
    ]
}
Logo

开发云社区提供前沿行业资讯和优质的学习知识,同时提供优质稳定、价格优惠的云主机、数据库、网络、云储存等云服务产品

更多推荐