javascriptvue.jsvuejs2

Disable the Vue Devtool extension tip


I love Vue in almost every aspect but this is logged whenever I start my Vue app:

Download the Vue Devtools extension for a better development experience:
https://github.com/vuejs/vue-devtools

I like to have a minimal development experience and I don't need this Vue extension. I'd like to disable this tip that I find annoying. How can I proceed?

What I've already tried

Looking at Vue's source code, the tip is logged by:

if (inBrowser) {
  setTimeout(function () {
    if (config.devtools) {
      if (devtools) {
        devtools.emit('init', Vue);
      } else if (
        true
      ) {
        console[console.info ? 'info' : 'log'](
          'Download the Vue Devtools extension for a better development experience:\n' +
          'https://github.com/vuejs/vue-devtools'
        );
      }
    }
    if ( true &&
      config.productionTip !== false &&
      typeof console !== 'undefined'
    ) {
      console[console.info ? 'info' : 'log'](
        "You are running Vue in development mode.\n" +
        "Make sure to turn on production mode when deploying for production.\n" +
        "See more tips at https://vuejs.org/guide/deployment.html"
      );
    }
  }, 0);
}

Contrary to the similar development mode warning that can be turned off by Vue.config.productionTip = false before new Vue({...}), there doesn't seems to be a config-based escape to prevent the tip to be logged. I therefore have the following options, which don't completely satisfy me:


Solution

  • From the source code you provided, have you tried the following before new Vue({...})?

    Vue.config.devtools = false