Chrome Extension Vue-devtools Not Detecting Vue


Answer :

I found this simple workaround:

  • right click the Vue icon and click Manage extensions
  • Scroll down and enable Allow access to file URLs
  • Restart your Chrome, and you'll be good.

NOTE: You might need to turn on debug mode by adding this line at the beginning of your script

Vue.config.devtools = true; 

If using Vue 3, you need the new version of the extension that is currently still in beta https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg?hl=en


When using the answer to samayo for beginners is not complete. It is important for confused people to know the code that is placed in some location.
The cause of leading to the problem is that you are using Vue.js from CDN. You should add the Vue.config.devtools = true; code snippet in your xxx.js file. For example:
example.js
Vue.config.devtools = true;  new Vue({   el: '#app',   data: {     message: 'Hello Vue!',   } }) 
Reference:

https://github.com/vuejs/vue-devtools/issues/190


Comments

Popular posts from this blog

Chemistry - Bond Angles In NH3 And NCl3

Are Regular VACUUM ANALYZE Still Recommended Under 9.1?

Change The Font Size Of Visual Studio Solution Explorer