Vite plugin not working in Yarn 4 monorepo

[viell-dev]

Not sure if this is a problem on your end of some quirk of Yarn.

failed to load config from /home/viell/projects/vite-plugin-bug-repro/packages/web/vite.config.mts
error when starting dev server:
Error: @vue/devtools-core tried to access vue, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.

Required package: vue (via "vue/package.json")
Required by: @vue/devtools-core@npm:7.2.0 (via /home/viell/.yarn/berry/cache/@vue-devtools-core-npm-7.2.0-6c8d6b484b-10c0.zip/node_modules/@vue/devtools-core/dist/index.js)

    at makeError (/home/viell/projects/vite-plugin-bug-repro/.pnp.cjs:8807:34)
    at resolveToUnqualified (/home/viell/projects/vite-plugin-bug-repro/.pnp.cjs:10455:21)
    at Object.resolveToUnqualified (/home/viell/projects/vite-plugin-bug-repro/.pnp.cjs:10635:26)
    at resolve$1 (file:///home/viell/projects/vite-plugin-bug-repro/.pnp.loader.mjs:2027:31)
    at nextResolve (node:internal/modules/esm/hooks:750:28)
    at Hooks.resolve (node:internal/modules/esm/hooks:238:30)
    at handleMessage (node:internal/modules/esm/worker:199:24)
    at Immediate.checkForMessages (node:internal/modules/esm/worker:141:28)
    at process.processImmediate (node:internal/timers:478:21)

Repro @ https://github.com/viell-dev/vite-plugin-bug-repro

Works fine as a standalone (see standalone branch)

Or if I add vue as a dependency of @vue/devtools-core in .yarnrc.yml (see workaround branch)

Edit: Upgraded to 7.2.0

[alexzhang1030]

Not very familiar with yarn4. Help wanted!

[Yordan-Ramchev]

@viell-dev I've managed to start it without errors. If you copy:

"dependencies": {
   "vue": "^3.4.27"
},

from packages/web/package.json to package.json (root), it will work as expected. I think this is more of a bundling error (yarn PNP) than devtools-next. Maybe there are some adjustments that you need to apply to your setup.

Reference:

Based on the console output PnP is using experimental loader, not sure if that is the case (maybe it can't move Vue dependency). Reference:

[viell-dev]

Turns out it also works fine if I add vue as a devDepenedency in the monorepo package.json. Guess it's just a Yarn quirk.