[Bug?]: Multi-folder VSCode workspaces not supported/ Documentation unclear

[dwjohnston]

Self-service

• I'd be willing to implement a fix (I'd be willing to update the documentation if that's what the suggested fix is).

Describe the bug

The editor SDKs appear not to work in a VSCode multi folder workspace.

The work around is to use a single folder VSCode workspaces.

Can the documentation be updated to reflect this? Or is there a better work around?

To reproduce

Very similar to this issue:

#3350

• Create new folder
• yarn set version berry
• yarn init
• yarn add typescript -D
• yarn add react
• yarn add @types/react
• Create new file index.ts
• write in index.ts import React from 'react'
• yarn dlx @yarnpkg/sdks vscode

(Or checkout this repo https://github.com/dwjohnston/yarn2-vscode-issue)

Now:

❌ Doesn't work:

Open VSCode -> New Window -> ✨ Add folder to workspace✨ -> select your folder

In index.ts you have red squiggly lines and:

Cannot find module 'react' or its corresponding type declarations.ts(2307)

cmd + shift +p -> Select TypeScript version -> there is no option to select TypeScript version.

Go to .vscode/setting.json note that typescript.tsdk and typescript.enablePromptUseWorkspaceTsdk are greyed out with the message:

This setting cannot be applied in this workspace. It will be applied when you open the containing workspace folder directly.

See this discussion re that message: microsoft/vscode#82117

✅ Does work

Open VSCode -> New Window -> ❇️ Open❇️ -> select your folder

cmd + shift +p -> Select TypeScript version -> Select workspace version.

Squiggly lines solved.

Environment

System:
OS: macOS 10.15.7
CPU: (8) x64 Intel(R) Core(TM) i7-8559U CPU @ 2.70GHz
Binaries:
Node: 14.17.0 - /private/var/folders/3_/7t918q9d1g9cpw7l31bzdmpwd8z945/T/xfs-c9b131cd/node
Yarn: 3.0.2 - /private/var/folders/3_/7t918q9d1g9cpw7l31bzdmpwd8z945/T/xfs-c9b131cd/yarn
npm: 6.14.13 - ~/.nvm/versions/node/v14.17.0/bin/npm

Version: 1.60.0

Additional context

No response

[arcanis]

The editor SDKs appear not to work in a VSCode multi folder workspace.

The work around is to use a single folder VSCode workspaces.

Can the documentation be updated to reflect this? Or is there a better work around?

I think this is mentioned here (although subtly; feel free to PR a better wording):

Note: Be aware that only the SDKs for the tools present in your root package.json will be installed (the tool won't look at the dependencies from your other workspaces). So don't forget to run the command again should you change the set of tools used by your project!

Multi-folder projects are I think difficult to make work, since each of them may have their own TS version/server. I don't know if VSCode itself supports it (vs just running the stock TS).

[dwjohnston]

^ Sure. At this point I'm happy running a single folder workspace. Perhaps the documentation here can mention that single folder workspace only is supported.

[yjoer]

I managed to make VSCode works with the integrations in multi-root workspaces. In my case, I had ESLint, Prettier, and TypeScript integrated. I copied the settings in the .vscode/settings.json file to the global workspaces settings.

Here's the step to get to the workspaces settings.

In VSCode -> File -> Preferences -> Settings -> Workspace -> Open Settings (JSON)

Similarly, you will expect the same JSON structure in a .code-workspace file.

{
  "folders": [
    {
      "name": "directory-1",
      "path": "path\\to\\directory-1"
    },
    {
      "name": "directory-2",
      "path": "path\\to\\directory-2"
    }
  ],
  "settings": {
+    "search.exclude": {
+      "**/.yarn": true,
+      "**/.pnp.*": true
+    },
+    "eslint.nodePath": ".yarn/sdks",
+    "prettier.prettierPath": ".yarn/sdks/prettier/index.js",
+    "typescript.tsdk": ".yarn/sdks/typescript/lib",
+    "typescript.enablePromptUseWorkspaceTsdk": true
  }
}

[yarnbot]

Hi! 👋

This issue looks stale, and doesn't feature the reproducible label - which implies that you didn't provide a working reproduction using Sherlock. As a result, it'll be closed in a few days unless a maintainer explicitly vouches for it or you edit your first post to include a formal reproduction (you can use the playground for that).

Note that we require Sherlock reproductions for long-lived issues (rather than standalone git repositories or similar) because we're a small team. Sherlock gives us the ability to check which bugs are still affecting the master branch at any given point, and decreases the amount of code we need to run on our own machines (thus leading to faster bug resolutions). It helps us help you! 😃

If you absolutely cannot reproduce a bug on Sherlock (for example because it's a Windows-only issue), a maintainer will have to manually add the upholded label. Thanks for helping us triaging our repository! 🌟

[ikhsanuddin]

I could reproduce the bug, with multi-folder VS Code workspace
Currently using yarn Version 3

It caused if you have multiple yarn 1 & yarn 2 project in single vs code folder with folder order of yarn 1 as first folder

I manage to prevent the bug, by putting Yarn 2 project first, then Yarn 1 project folders