14

我试图以更积极的方式突出错误，在 VS Code 中是否可能？

基本上改变这种风格：

在此处输入图像描述

UPD：webStorm 中激进的高亮示例：

在此处输入图像描述

4

5 回答 5

16

更新- 2020 年 11 月

为错误样式设置背景颜色的属性终于来了！合并 PR 这里

editorInfo.background
editorWarning.background
editorError.background

这还没有发布- 我想它可能会在下一个主要版本（v1.16）中发布。发生这种情况时将在此处更新以确认版本。

v1.12及以上

现在可以通过workbench.colorCustomizations工作区设置本地自定义错误下划线颜色。请参阅此处的文档。

"workbench.colorCustomizations": {
  "editorError.foreground": "#000000", // squiggly line
  "editorError.border": "#ffffff" // additional border under squiggly line
}

不幸的是，据我所知，目前本地自定义仅限于此。例如，要使用背景颜色突出显示错误，您仍然必须使用下面的插件方法...

v1.7.2 及以上

错误样式可以通过带有vscode-custom-css扩展的 css 完全自定义。

使用以下内容创建文件custom-styles.css（根据需要更改样式）

.monaco-editor.vs .redsquiggly,
.monaco-editor.vs-dark .redsquiggly {
  background: rgba(255,255,255,0.2);
  border-bottom: 1px solid #fff;
}

通过在( )custom-styles.css中添加以下内容来指向扩展名Preferences > User Settingssettings.json

{
  "vscode_custom_css.imports" : [
    "file:///path/to/file/custom-styles.css"
  ]
}

打开命令面板（Mac：cmd++ ，Windows/Linux：++ shift）并搜索并执行，然后重新启动 VS Code。PctrlshiftPEnable Custom CSS and JS

你完成了！

应用上述样式的屏幕截图：应用了上述样式的屏幕截图

如果您在配置中遇到任何错误，或者您对custom-styles.css.

NB感谢@Stepan Suvorov 提出了 github 问题和@Matt Bierner 指出了适当的 css，所以我可以通过扩展来解决这个问题。

如果任何 VS Code 开发人员碰巧正在阅读本文，首先感谢 - VS Code 很棒 - 但是内置的错误样式对于色盲人士来说是一个重要的可访问性问题。我是红绿色盲，黑色背景上的红色波浪线对我来说是一个很大的压力，特别是对于单个字符。

自定义错误样式的能力是我真正错过的最后一件事，从 atom 切换到 VS Code。对此的官方支持将是一个很棒的功能！

于 2016-12-08T12:11:38.727 回答
3

不幸的是，将近一年后，vscode-custom-css 不再为我工作；同时 vscode 引入了一些设置来自定义布局。

尝试在用户设置中添加：

{
  // ...,
  "workbench.colorCustomizations": {
    "editorError.border": "#ca2323a4",
    "editorError.foreground": "#ffffffb7"
  }
}

它将以这种方式显示错误：

在此处输入图像描述

于 2017-11-06T21:41:56.810 回答
1

您很快就能修改错误、警告和信息的背景颜色。请参阅https://github.com/microsoft/vscode/pull/110112，应该在 v1.52 中。

editorError.background
editorWarning.background
editorInfo.background

以前，背景颜色无法更改。

于 2020-11-09T21:53:13.963 回答
1

这适用于版本 1.58.0：

以下 JSON 进入您的 settings.json，我通过设置 -> 工作台 -> 外观 -> 颜色自定义访问了该文件：

{
   "workbench.colorCustomizations": {
        "errorForeground": "#ffffff",
        "editorError.background": "#ff0000",
        "editorWarning.foreground": "#ffffff",
        "editorWarning.background": "#dddd00",
        "editorInfo.foreground": "#ffffff",
        "editorInfo.background": "#0000ff"

    }
}
于 2021-07-13T14:55:21.000 回答
0

据我所知，更改错误样式并不是 VSCode 主题或扩展目前可以做的事情。这个逻辑是内置的。这是用于渲染redsquiggly当前的 css

我建议您针对 VSCode 打开一个功能请求

于 2016-11-29T02:14:56.200 回答