VScode 自动提示背景 - JavaScript

当你在使用 VScode 进行 JavaScript 开发时，你可能已经注意到它提供了很多有用的自动提示功能，这使写代码更加快捷和准确。但是，有时候可能会遇到提示背景颜色太浅而不易看清的情况，这个问题可以通过自定义 VScode 的主题来解决。

如何更改主题

1. 打开 VScode 并点击左侧菜单栏的“设置”图标（齿轮形状）。

2. 在搜索框中输入“color theme”，然后选择“Preferences: Color Theme”。

   

3. 在“Color Theme”下拉列表中选择一个主题，如“default dark+”。

   

4. 如果你想让提示背景颜色更深或更鲜艳，你可以选择一些不同的主题或手动自定义主题。

自定义主题

1. 打开 VScode 并点击左侧菜单栏的“设置”图标（齿轮形状）。

2. 在搜索框中输入“color theme”，然后选择“Preferences: Color Theme”。

3. 点击“Edit in settings.json”按钮，在打开的文件中找到 "editor.tokenColorCustomizations" 字段，如果它不存在，则使用以下代码片段手动添加：

   ```json
    "editor.tokenColorCustomizations": {
        "textMateRules": [
            {
                "scope": [
                    "variable.language",
                    "variable.parameter",
                    "support.constant.property-value.json",
                    "entity.other.attribute-name.tag.js",
                    "support.constant.property-value.css",
                    "support.constant.font-name.css",
                    "support.constant.media-type.css",
                    "constant.other.color",
                    "constant.numeric",
                    "constant.character",
                    "constant.language",
                    "constant.other"
                ],
                "settings": {
                    "foreground": "#FFFFFF",
                    "background": "#2E3440"
                }
            },
            {
                "scope": [
                    "keyword.control.js",
                    "storage.modifier",
                    "storage.type.function.arrow.js",
                    "keyword.operator.js",
                    "variable.parameter.function",
                    "support.function.dom.js",
                    "support.class.js"
                ],
                "settings": {
                    "foreground": "#FFB86C"
                }
            }
        ]
    }
   

   
   这段代码将修改提示背景为深色，并将所有变量和常量的文本颜色设置为白色。你可以根据自己的需求自定义代码的颜色。
   
   

4. 保存并应用更改，重启 VScode 后生效。

结论

在 JavaScript 开发中，VScode 自动提示功能非常实用，通过修改主题可以帮助你更好地使用这一功能。你可以选择 VScode 内置的主题或根据自己的需求定制主题，以达到更好的开发体验。