How to change error styles in VS code?

Question

I am trying to highlight the error more aggressively, is this possible in VS Code?

Basically change the style of this:

UPD: an example of aggressive highlighting in webStorm:

Answer 1

v1.12 and higher

Setting colors for underlining errors is now available initially through workbench.colorCustomizationsthe workspace settings. See here .

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

Unfortunately, as far as I can find, currently my own settings are limited to this. For example, to highlight an error with a background color, you still have to resort to the plugin method below ...

---

v1.7.2 and higher

css vscode-custom-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 Settings (settings.json)

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

(Mac: cmd + shift + P, Windows/Linux: ctrl + shift + P) Enable Custom CSS and JS, VS.

!

:

- - custom-styles.css, VS-, / .

---

N.B. @Stepan Suvorov github @Matt Bierner css, .

- VS, -, , -, - VS Code - , . - , - , .

- , , VS Code . !

Answer 2

, , VSCode. . css redsquiggly

VSCode

Answer 3

After almost a year, unfortunately, vscode-custom-css stops working for me; vscode meanwhile introduced some settings for layout customization.

Try adding this to your user preferences:

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

It will show errors in this way: