Laravel7.3.3+Vue2.6.12环境下Vue Devtools仅显示<Root>组件求助

• 确认Vue生产模式配置
  Laravel默认生产环境编译会自动关闭Devtools支持，你可以在入口JS文件（通常为resources/js/app.js）中手动强制开启Devtools，代码要放在new Vue()实例化之前：

Vue.config.devtools = true
Vue.config.productionTip = false

添加完成后执行npm run dev重新编译前端资源，刷新页面后再查看Devtools显示。

• 核对组件注册逻辑
  全局注册的组件必须写在Vue实例化之前，局部注册的单文件组件要确认已经正确写入对应父组件的components属性中，组件名称、导入路径无拼写错误。
• 检查Vue Devtools扩展配置
  确认你安装的是适配Vue2版本的Devtools，不要同时启用Vue3版本的Devtools扩展。另外在浏览器扩展管理页，打开Vue Devtools的「允许访问文件网址」权限，如果是在无痕模式下测试还要开启「无痕模式下启用」选项。
• 排查实例挂载与初始化冲突
  首先确认Vue实例的el绑定的DOM节点ID唯一，页面中不存在重复ID的节点。另外检查是否存在app.js重复引入的问题：如果Laravel的全局布局模板和子页面模板都引入了编译后的JS文件，会导致Vue实例重复初始化，也会触发仅显示Root组件的问题。你可以在浏览器控制台输入__VUE_DEVTOOLS_GLOBAL_HOOK__.Vue验证是否能正常获取项目内的Vue构造函数，返回空则代表初始化逻辑存在冲突。

内容的提问来源于stack exchange，提问作者Yex777