Chrome 中的 Vue DevTools：检测到 Vue 但未显示任何数据

如何解决Chrome 中的 Vue DevTools：检测到 Vue 但未显示任何数据

我是 Vue 的新手，我想试用 DevTools。我使用 vue cli 创建了一个全新的应用程序（没有额外的代码），应用程序是 Vue v2，我的 chrome 插件是 v6.0.0 beta 3。

vue create my-app

在开发模式下运行应用程序时，chrome 工具栏 devtools 'V' 显示绿色并表示检测到 Vue。我按 F12，我在开发者控制台中看到 Vue 选项卡但它是空的，应用程序下拉列表显示“无应用程序”并且列表中没有任何内容，组件下拉列表也是空的。

单击开发控制台中的 Vue 选项卡后，我在控制台中注意到了这一点：

[HMR] Waiting for update signal from WDS...
DevTools Failed to load SourceMap: Could not load content for chrome-   extension://ljjemllljcmogpfapbkkighbhhppjdbg/build/queue.js.map: HTTP error: status code 404,net::ERR_UNKNowN_URL_SCHEME
Enabling backend for Vue 2
connect
connect done
Uncaught (in promise) TypeError: Cannot set property '__VUE_DEVTOOLS_UID__' of null
at registerappJob (backend.js:1414)
App with id 0 not found
Uncaught (in promise) TypeError: Cannot read property 'id' of null

我还需要配置什么才能启用 Vue DevTools？

解决方法

这很可能是 DevTools v6 中的一个问题 - 它仍处于测试阶段。恢复到 v5，它会正常工作。您可以尝试在 Github 上提交问题，以便他们修复错误。