3

I am new to Vue and I experiment with Vue 3 Composition API, which I created demo app and it works fine.

I installed Vue.js Devtools in Chrome, but when I open my site I can do nothing with it; it has a gray/disabled look and when I click on it, I get tooltip "Vue.js not detected", and in my Developer Tools I don't see any tab regarding Vue or whatsoever.

EDIT: I run some localhost app like "http://localhost:8998/#/home"

EDIT2: Which one? IDK, I just googled it and chose the one at the top with the best user rating, I add a capture enter image description here

Improve this question
9
  • Can you add some more details? How you created/initialise the app etc. Commented Nov 21, 2020 at 18:27
  • Also, did you install the latest Vue Devtools? There's a new version for Vue 3 Commented Nov 21, 2020 at 18:27
  • 1
    For Vue 3 you need to install the version 6 beta of the Devtools. Links: v3.vuejs.org/guide/installation.html#vue-devtools Commented Nov 21, 2020 at 19:50
  • 1
    You need version 6 of the Vue Devtools, not Chrome Devtools. The link I provided should guide you to the relevant download. From the picture in your question it seems you have the wrong one. You need the one at the top, with the orange beta logo. You may also need to disable the other copy of the Devtools (this is explained on the download page). Commented Nov 24, 2020 at 10:39
  • 1
    Thank you. I tried installed that beta, but the result is the same. I disabled other 2 extensions I use (all others were disabled before in the past) "Clear cache" and "Moesif Origin & CORS Changer" however, the results are same. I open the page running Vue solution, and open developer tools, icon is gray and says "Vue.js not detected". I tried closing devtools, closing tab, closing browser, etc. Commented Nov 27, 2020 at 10:32

3 Answers 3

Reset to default
1

credit: skirtle

Vue 2 and Vue 3 have separate versions of the devtools. Make sure you’re using the version that’s compatible with Vue 3. Currently that’d be 6.0.0 beta 3.

You’ll also need to use a dev build of Vue for the devtools to be able to interact with it. It won’t work with a production build of Vue.

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

Comments

0

I also had problems with the plugin for Vue3. Recently a new version came out and now everything is working. Below is the link to the working version: https://devtools.vuejs.org/guide/installation.html

Improve this answer

Comments

-2

Have you tried npm run dev? Your Vue application needs to be in development mode in order for the Vue dev tools tab to display.

Improve this answer

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.