fi3ework / vite-plugin-checker

💬 Vite plugin that provide checks of TypeScript, ESLint, vue-tsc, Stylelint and more.
https://vite-plugin-checker.netlify.app
MIT License
1.01k stars 88 forks source link

Show warnings only in console #116

Open GabriFila opened 2 years ago

GabriFila commented 2 years ago

Hi, love this plugin!

Is there a way to now show any kind of warning (TS, ESlint, ...) as an overlay but show them only in the console? A bit like CRA behaves?

Thank you

fi3ework commented 2 years ago

It's not configurable to disable the runtime code for now. But as a workaround, you can pass display: none; to the badgeStyle property to hide the badge entirely at development mode and no runtime of this plugin will be bundled in production mode. Check the documentaion https://github.com/fi3ework/vite-plugin-checker/blob/main/README.md#checker-common-config

GabriFila commented 2 years ago

I didn't fully understand your answer, why do you mention runtime code? How difficult would it be to add this feature? Could I make a PR?

Thanks

fi3ework commented 2 years ago

configure it like this and the badge will disappear.

export default defineConfig({
  plugins: [
    checker({
      overlay: { badgeStyle: 'display: none;' , }
    }),
  ],
})

The runtime code refers to the overlay code which is injected into the index.html under development mode. Ideally, if we disable the overlay, there's no injected runtime code at all. But for now, we can display: none to achieve the same target, but there's still runtime code injected without visibility. I can't tell how much it will cost to make a PR. Feel free to commit any code even you are not sure does it OK with all edge cases.

SutuSebastian commented 2 years ago

@fi3ework I think what @GabriFila was trying to say is that if the warnings (most likely from ESLint) in the overlay could be hidden (not by default, but configurable) but visible in the terminal output.

GabriFila commented 2 years ago

Yes that's it. Since the popup is blocking, to me it makes sense to have it only when it is an error. I like to see warnings only in the console like "I know it's there but I'll think about it later"

SutuSebastian commented 2 years ago

@GabriFila I want to achieve the same exact behaviour 👍

AndreKR commented 2 years ago

This issue is done, isn't it? I was able to disable the overlay with overlay: false:

plugins: [vue(), checker({ eslint: { lintCommand: 'eslint src' }, overlay: false })],
SutuSebastian commented 2 years ago

@AndreKR the main issue is that we can't control the granularity on the "disabled" state of, for example: "warnings", being enabled in terminal output but disabled in the overlay.

slutske22 commented 11 months ago

Hard agree. Would love to see both TS errors and eslint warnings in the console, but only ts errors in the overlay

moander commented 8 months ago

Note to Quasar users. Plugin checker config is found in quasar.config.js

image