The Vue devtools are fantastic tools that allow us to easily debug our applications in Vue; the reason for this is that when we create an app in Vue, based on components, everything ends up in a single file and if a part or component fails or we want to track it and we debug said application with the tools that already exist. we know:
As you can see, we don't see anything related to our app in components; to be able to debug properly and be able to see components and properties, we have to install the devtools that we have in most modern browsers like Firefox or Google Chrome; in the case of Google Chrome:
https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg
https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?hl=es
I leave two links since the beta version is the only one that supports Vue 3; and with this, we have a new tab in our developer console:
In which, as you can see, we see the app as it really is.
- Andrés Cruz
En español
Develop with Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter