How I can turn off the "vue-devtools Detected" message on the console?

[dortamiguel]

Version

4.1.4

Browser and OS info

chrome 66

Steps to reproduce

Just install the devtools and open a vue app.

What is expected?

I want to turn off the message "vue-devtools Detected" on the console.

What is actually happening?

I can't find any option to turn off this message.

[dortamiguel]

[emanuelmutschlechner]

Are you using a non-production build? This message won't be shown if you build your app in production mode. Else try Vue.config.devtools=false in your main js file

[dortamiguel]

Vue.config.devtools=false works for me 🙂

[dortamiguel]

If I do Vue.config.devtools=false then the devtools stop working. What I mean is I want to use the devtools but avoid the message while developing.

[emanuelmutschlechner]

Is there a specific reason you don't want that message in the console log?

[dortamiguel]

I just like to have the console clean, I already can see here that the devtools are enabled

[emanuelmutschlechner]

Just looked at the code. This message is always shown when devtools connect to Vue and can't be disabled

[emanuelmutschlechner]

If you really want to have a clean log then the only thing you can do is to clear the console yourself by calling console.clear() or window.clear(). Or else use the available keyboard shortcuts Ctrl+L or Cmd + L

[shirshak55]

I guess there is no reason for that message. Yeah I also want clean console instead of useless message like Vue Devtool is connected etc..

CMD + L is currently what we are doing but every refresh page it sucks :(

[husayt]

Might be a good idea to let disable/enable this as an option to settings. See #547

[tdkn]

This is very annoying behavior. Should be able to disable/enable.

[Akryum]

I still fail to see how is this "very annoying behavior" but hey. It's not a priority anyway.

[rowild]

I join the plenum: would like to not be distracted by that, if I wish, so please offer a little toggle to disable that message - thank you!

[eldoy]

Please disable all console logs by default. It's annoying.

[shirshak55]

Its too annoying to see vue tools detected when we already know we are using vue. So how is this useful feature at any means?

What is use case of showing Vue Devtool detected? It is not going to be shown in production anyway then why show it in local development.

We prefer clean console :)

[Dwood15]

This message is annoying (and redundant) given we have the vue-devtools icon in the plugin bar.

[rowild]

For the moment a workaround would be to right-click the line in question in the console and choose "Don't show any messages from Vue Devtools anymore" (or whatever the correct text might be...)

[bg]

Selenium driving Chrome headless which is a part of our test suite spits out the related message to download Vue DevTools in the middle of my test runs, obscuring legitimately concerning console messages that might occur during development test runs. Vue DevTools doesn't even make sense in that context, making it doubly annoying. Will the PR above fix both problems at once?

[emanuelmutschlechner]

@bg This PR adds a toggle to the settings tab where the mentioned message can be disabled globally. The setting will be persisted in LocalStorage like other devtool settings.

[bg]

Shoot ... I wasn't paying attention closely enough. It stands to reason if Chrome driven by Selenium for my tests doesn't even load Vue DevTools (even though my usual development profile for Chrome has it loaded), this is Vue's problem, not vue-devtool's. I need a different solution to my superficially similar but otherwise unrelated problem. Thanks.

[givinguphope]

Why config option? This message is practically useless... Is there any other purpose of this besides someone showing off applying CSS in Chrome console?

[jbosse]

Remember that time you released a development build into production by accident? If you don’t you haven’t been working on the web that long. This feature is important because if you see it in production then you know something has gone wrong.

[jbosse]

You clean console folks should be more annoyed by all the CSP violation errors that get thrown by the dev tools. Those really pollute the console.

If you aren’t getting those then you should be worried more about the poor CSP on your website than an informational console log.

[shirshak55]

CSP is another issue not related with this. In production who open devtool for vue as it is already disabled. So this message is practically useless. It seems like advertisement of vue only ...

React devtool never shows the message.

[gitsakil09]

Vue.config.productionTip = false should hide the message

[LarenDorr]

I found a method to hidden console log.
Just add -[flush] to console filter input.
Before:

After:

If you want to hidden vue-devtools badge, just add -vue-devtools .
Others same, just add -xxx(you want hidden key)