526互联

vue3 devtool

发布时间 2023-11-07 11:18:18作者: 7c89
打开控制台，输入下面代码：var vue = app.__vue_app__
    const hook = window['__VUE_DEVTOOLS_GLOBAL_HOOK__']
    hook.emit('app:init',vue,vue.version,{
    Fragment: 'Fragment',
    Text: 'Text',
    Comment: 'Comment',
    Static: 'Static'
})
然后重新打开调试器就行。缺点是关闭标签页会失效，需要重新配置。
var Vue, walker, node
walker = document.createTreeWalker(document.body, 1)
while ((node = walker.nextNode())) {
  if (node.__vue_app__) {
    var vue = node.__vue_app__
    const hook = window['__VUE_DEVTOOLS_GLOBAL_HOOK__']
    hook.emit('app:init', vue, vue.version, {
      Fragment: 'Fragment',
      Text: 'Text',
      Comment: 'Comment',
      Static: 'Static'
    })
  }
}


部署后 vue nuxt 开启 vue devtool 
const VueObj = document.querySelector('#__nuxt').__vue__.__proto__.__proto__.constructor

//VueObj.config.devtools = true
window.__VUE_DEVTOOLS_GLOBAL_HOOK__.emit('init', VueObj)

vue3
window.__VUE_DEVTOOLS_GLOBAL_HOOK__.emit('init', document.querySelector('#app').__vue_app__.__proto__.constructor)