How to hide ESlint/webpack's HMR error overlay

Viewed 414

After I run npm run dev nuxt builds the app and displays it and a second later a partly transparent full-viewport modal gets displayed on top of the app (in the browser) listing very 'helpfully' a bunch of eslint errors.

I would like to keep the errors being printed in terminal, but not displayed on top of the page I'm working on.

Can this be achieved? And how?

1 Answers

If we're talking about the same thing (image below), this should be done thanks to this globally applied CSS

#webpack-hot-middleware-clientOverlay {
  display: none;
}

enter image description here


You are talking about the squiggles under your code? This can be solved with this IMO: https://stackoverflow.com/a/48610661/8816585

settings.json (VScode's palette + Preferences: Open Settings (JSON))

{
  "workbench.colorCustomizations": {
    "editorError.foreground": "#00000000",
    "editorWarning.foreground": "#00000000",
    "editorInfo.foreground": "#00000000"
  }
}
Related