Enable Vue Devtools in production

Manual

Open Chrome Developer tools Console and run following code.

// Get Vue app instance and version
const app = Array.from(document.querySelectorAll("*")).find(
  (e) => e.__vue_app__
).__vue_app__;
const version = app.version;

// Get Devtools instance
const devtools = window.__VUE_DEVTOOLS_GLOBAL_HOOK__;

// Enable Devtools
devtools.enabled = true;

// Reinitialize Vue app instance
devtools.emit("app:init", app, version, {});

Relaod devtools

/posts/vue/enable_devtools_in_production/vue_devtools_1.png

/posts/vue/enable_devtools_in_production/vue_devtools_2.png

Now you can access Vue Devtools

Extension

Install Crome extension Vue force dev

/posts/vue/enable_devtools_in_production/vue_devtools_3.png