Vue devtools tab not showing up in firefox devtools

vuejs / devtools-v6

⚙️ Browser devtools extension for debugging Vue.js applications.

https://devtools-v6.vuejs.org/

MIT License

24.68k stars 4.14k forks source link

Vue devtools tab not showing up in firefox devtools #1515

Open uhexos opened 3 years ago

uhexos commented 3 years ago

Version

6.0.0-beta.15

Browser and OS info

Firefox 89.02/ Linux Mint 20.1 Cinnamon

Steps to reproduce

After installing the vue dev tools xpi from the beta channel I am unable to see the vue devtool tab in the console area. Vue is installed using vite if that makes a difference.

What is expected?

To see the dev tools extension in the firefox developer tools tabs

What is actually happening?

The tab never appears but it shows Vue.js is detected on this page.

cedon commented 3 years ago

Also having this issue. Same version of devtools.

Browser and OS info Firefox Developer Edition 91.0b9 / Windows 10.0.19043.1110

piperone commented 3 years ago

Same on mac.

Browser and OS info FIrefox Developer Edition 92.0b3 / macOS Big Sur 11.4

YYangLee commented 3 years ago

You can try this: Add this code in main.js if (process.env.NODE_ENV === 'development') { Vue.config.devtools = true if (typeof window.__VUE_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined') { window.__VUE_DEVTOOLS_GLOBAL_HOOK__.emit('init', Vue) } }

m-z-b commented 3 years ago

Had the same problem with Firefox (both Ubuntu 20 and Windows 11 versions) with version 6.0.0.18.

Solution (for me) was toggling the Vue.js devtools option in the Web Developer Tools / Settings

Can reproduce problem by deleting the Firefox config variable devtools.webextensions.{c087fa6e-b59f-475d-b08d-f03fef34fa7f}.enabled

The extension is then shown as enabled in Web Developer Tools/Settings but the tab does not appear. Possibly two different uses of this config value are assuming a different default if the setting is missing.

haotan19 commented 3 years ago

Same here. Toggling on and off the devtools solved my problem.

AndreasNasman commented 2 years ago

I had the same problem since the tab was disabled in my dev tools settings; not sure when/why it was disabled. It would be nice if the extension could warn about this or auto-enable it when the extension is activated.

This is where you check if the tab is enabled in Firefox Developer Tools: