vuejs / devtools-v6

⚙️ Browser devtools extension for debugging Vue.js applications.
https://devtools-v6.vuejs.org/
MIT License
24.69k stars 4.14k forks source link

Devtools tab not available in Nuxt 3 app #2018

Open kylelogue opened 1 year ago

kylelogue commented 1 year ago

Vue devtools version

6.4.5

Link to minimal reproduction

https://1g32j.sse.codesandbox.io

Steps to reproduce & screenshots

Create a new Nuxt 3 App and install dependencies using the following commands:

npx nuxi init test-project
cd test-project
npx nuxi init test-project
npm install

Run the application: npm run dev

In Chrome, open the developer console after visiting localhost:3000. Note that the icon displays "Nuxt.js + Vue.js is detected on this page.", but the Vue tab is not in devtools.

Additional context: Using the beta Vue devtools extension version 6.0.0 beta 21 does not have this issue and the Vue tab is visible, so that is a workaround for now.

What is expected?

The Vue tab should be visible in version v6.4.5

What is actually happening?

The Vue tab is not visible in version v6.4.5, but is visible in v6.0.0 beta 21

System Info

System:
    OS: macOS 11.7.2
    CPU: (8) arm64 Apple M1
    Memory: 179.89 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.13.1 - ~/.nvm/versions/node/v16.13.1/bin/node
    npm: 8.1.2 - ~/.nvm/versions/node/v16.13.1/bin/npm
  Browsers:
    Chrome: 109.0.5414.87
    Safari: 16.2

Any additional comments?

No response

rahul-dutt-sharma commented 1 year ago

I can get this to show. However no matter what I try I can't show devtools once i have used either build/generate from nuxt

Juanpam commented 1 year ago

@rahul-dutt-sharma I've opened an issue (https://github.com/nuxt/nuxt/issues/22003) in Nuxt 3 official repo as I'm facing the same issue. I think it is related to nuxt rather than vue devtools as it works in dev mode but not with build/generate