Yarn 3 incompatibility

[orimay]

Thank you for the awesome extension! I loved using it with takeover mode, but it seems completely broken as of moving off to Yarn 3 without the node_modules folder.

First of all, it doesn't seem to work with Yarn 3 relative path workspaces. If I have my dependency like

"gun": "workspace:packages/gun",

I can't refer to it like

import Gun from 'gun';

And get to refer to it like

import Gun from '@/../../gun';

instead.

Even though without Volar, Yarn 3 workspaces are perfectly handled.

If I disable Take Over Mode, Vue TS checks fail completely:

Then, VSCode shows two tooltips rather than one:

If Volar has any issues that VSCode has not, these messages differ:

The upper one finds the module, the lower one (Volar) does not.

Last, but not least -- Volar doesn't import packages from .yarn:

Is Yarn 3 support not intended? I really wish it was working. Hope it's not much of a headache to fix this. Thank you in advance!

[johnsoncodehk]

Hi @orimay, first thanks for the report!

I'm not familiar with yarn3, do I just need to switch to yarn v3 and can this problem reproduce in https://github.com/johnsoncodehk/volar-starter too? I will check it later.

[orimay]

Hello, @johnsoncodehk! I installed latest Yarn with the use of its PnP feature, which gets rid of node_moules folder. It serves its own scripts for tsserver like here:

Thank you!

[merceyz]

Could you provide a reproduction? I have Volar working with PnP in my projects.

[orimay]

Oh, sorry, I forgot to mention that I also use Yarn 3 workspaces, and that's the part I'm struggling with. I only mentioned it in my first post

[ferm10n]

@orimay I was able to create a simple project that uses yarn pnp and workspaces. Made a couple of dumb mistakes along the way, but ended up with a sanity verifying checklist which might be helpful:

• are you able to import a workspace package from a .ts file?
• is vscode using the workspace version of typescript?
• does importing your package if you use the "gun": "workspace:*" notation instead of the experimental relative path one ("gun": "workspace:packages/gun")?
• is the latest version of vue-tsc installed?
• any weird output from "Volar - API" ?

[adalinesimonian]

here's a reproduction repository: https://github.com/adalinesimonian/volar-pnp-test

i've tested this in a workspace and without and it happens either which way.

[adalinesimonian]

testing further, the language server does receive the correct workspace configuration which includes the path to the typescript pnp sdk:

[Trace - 8:19:52 AM] Sending response 'workspace/configuration - (7)'. Processing request took 0ms
Result: [
    {
        "tsdk": ".yarn/sdks/typescript/lib",
        "disableAutomaticTypeAcquisition": false,
        "enablePromptUseWorkspaceTsdk": true,

does volar respect the typescript location in vscode settings?

[adalinesimonian]

i added some logs into volar's reloadServers to see if the tsdk path was resolved correctly, and the path is correct:

/.../volar-pnp-test/.yarn/sdks/typescript/lib/tsserverlibrary.js

continuing to dig further

[merceyz]

here's a reproduction repository: https://github.com/adalinesimonian/volar-pnp-test

@adalinesimonian Downgrade to typescript@4.8.3 and it should work, see yarnpkg/berry#4915.

[adalinesimonian]

downgraded to 4.8.3. now, in a single repo, it works as expected. however, in a monorepo, the same resolution errors occur.

here's a reproduction monorepo: https://github.com/adalinesimonian/volar-workspaces-pnp-test

[johnsoncodehk]

Sorry i'm not familiar with this part, I assume that we just need setting the yarn 3 version tsdk to typescript.tsdk?

I will add documentation for it. (If I'm right)

[Lexpeartha]

Sorry i'm not familiar with this part, I assume that we just need setting the yarn 3 version tsdk to typescript.tsdk?

In Volar "Take-over" mode TS/JS language server gets completelly replaced by Vue + TS server, which presumably doesn't recognise ts sdk provided by yarn

[merceyz]

however, in a monorepo, the same resolution errors occur.
here's a reproduction monorepo: https://github.com/adalinesimonian/volar-workspaces-pnp-test

@adalinesimonian The error I get in that repo is

Cannot find module 'vue'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option?ts(2792)

If I then set the moduleResolution to node it works.

---

Sorry i'm not familiar with this part, I assume that we just need setting the yarn 3 version tsdk to typescript.tsdk?
I will add documentation for it. (If I'm right)

@johnsoncodehk typescript.tsdk is set by Yarn so Volar just needs to be told to use the workspace version. https://yarnpkg.com/getting-started/editor-sdks/#vscode
If the workspace is trusted and typescript.tsdk is set Volar could probably pick the workspace version automatically.

---

which presumably doesn't recognise ts sdk provided by yarn

@Lexpeartha it recognizes it.

[GuilhermeAB]

This works for me:

[gavin-lb]

I am still unable to get the "Go To Definition" feature of VS Code to work when using Yarn PnP and Volar.

There has been an issue open with Yarn for several years without fix. Is this something that could be fixed from Volar side instead?