1

I'm new to Vue and I want to try out the DevTools. I created a brand new app using vue cli (no additional code), the app is Vue v2 and my chrome plugin is v6.0.0 beta 3.

vue create my-app

When running the app in dev mode, the chrome toolbar devtools 'V' shows green and indicates that Vue is detected. I hit F12 and I see the Vue tab in the developer console BUT it is empty, the App dropdown shows 'No App' and there is nothing in the list, the Components dropdown is also empty.

I noticed this in the console after I click the Vue tab in dev console:

[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

Is there something else I need to config to enable the Vue DevTools?

2
  • You should revert to the latest v5 - the new extension is still in beta. Commented Jan 29, 2021 at 7:51
  • I didn't even think of that, thanks v5 is working fine! Post an answer and I'll accept... Commented Jan 29, 2021 at 11:19

1 Answer 1

0

This is most probably an issue in v6 of DevTools - it is still in beta. Revert to v5 and it will work fine. You can try to file an issue on Github so they can fix the bug.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.