Vue2/Vue3 项目生产环境开启 vue devtools 插件线上调试

Vue2 项目开启 vue devtools

在 控制台 运行以下代码

var node;
const walker = document.createTreeWalker(document.body,1);
while ((node = walker.nextNode())) {
  if (node.__vue__) {
    const Vue = node.__vue__.$options._base;
    if (!Vue.config.devtools) {
      Vue.config.devtools = true;
      if (window.__VUE_DEVTOOLS_GLOBAL_HOOK__) {
        window.__VUE_DEVTOOLS_GLOBAL_HOOK__.emit('init', Vue);
        console.log('==> vue devtools now is enabled');
      }
    }
    break;
  }
}

Vue3 项目开启 vue devtools

var node;
const walker = document.createTreeWalker(document.body,1);
while ((node = walker.nextNode())) {
  const vm = node.__vue_app__
  if (vm) {
    window.__VUE_DEVTOOLS_GLOBAL_HOOK__.apps.push({
      app: vm,
      version: vm.version,
      types: {
        Comment: Symbol('Comment'),
        Fragment: Symbol('Fragment'),
        Static: Symbol('Static'),
        Text: Symbol('Text'),
      },
    })
    if (window.__VUE_DEVTOOLS_GLOBAL_HOOK__) {
      window.__VUE_DEVTOOLS_GLOBAL_HOOK__.emit('init', vm);
      console.log('==> vue devtools now is enabled');
    }
    break;
  }
}