As of writing this article, there is no good way to see vue-devtools when developing apps in iFrame. Hence I found out this following way to use the vue-devtools via this electron app.
Installation
Install the vue-devtools package.
npm install -g @vue/devtools
Configuration
Once you install the package globally, run
vue-devtools
Then add:
<script src="http://localhost:8098"></script>
To the <head>
section of your app.
Note:
Don’t forget to remove it before deploying to production!
That’s it! You can now view the devtools on running of your application. Now you can debug your app opened in a mobile browser, safari, native script, etc. not just desktop chrome or firefox.
Hope you found this short article useful. If so hit 👍🏻 and spread the word!