如何配置VSCode以运行Thread 2（使用PnP）驱动的TypeScript

Question

如何配置VSCode以运行Thread 2（使用PnP）驱动的TypeScript

我喜欢使用纱线2（与PnP），几个月前我设置了一个项目，它工作得很好。现在我试图设置一个新的项目，但无论我尝试什么，我都无法让VSCode正确解析模块。旧项目仍然有效，我的测试用例在其中正常工作，所以问题所在的一定是新项目，而不是VSCode。

我的新项目设置如下：

mkdir my-project
cd my-project
npm install -g npm
npm install -g yarn
yarn set version berry
yarn init
yarn add --dev @types/node typescript ts-node prettier
yarn dlx @yarnpkg/pnpify --sdk vscode
cat <<'EOF' > tsconfig.json
{
  "compilerOptions": {
    "types": [
      "node"
    ]
  }
}
EOF
mkdir src
cat <<'EOF' > src/test.ts
process.once("SIGINT", () => process.exit(0));
EOF

我确实在StackExchange和其他地方检查了类似的问题，但它们归结为运行pnpify，并在VSCode中选择TypeScript版本作为其工作台-pnpify版本，我都这样做了。我还确保执行了一个重新加载窗口，但仍然出现以下错误：

在tsconfig中。json：找不到“节点”的类型定义文件。

在测试中。ts：找不到名称“进程”。是否需要为节点安装类型定义？尝试npm i——保存dev@types/node，然后将node添加到tsconfig中的types字段。

重要的是要注意，我可以运行test.ts而没有任何问题，例如：yarn ts-nodesrc/test.ts。因此，问题似乎仅限于VSCode的工作台配置（VSCode仍然可以为我的旧项目解析模块）。

在我的设置中，我遗漏了哪些步骤来让Thread 2（带有PnP）驱动的TypeScript在VSCode中正常工作？

VSCode关于信息：

Version: 1.51.1
Commit: e5a624b788d92b8d34d1392e4c4d9789406efe8f
Date: 2020-11-10T23:31:29.624Z
Electron: 9.3.3
Chrome: 83.0.4103.122
Node.js: 12.14.1
V8: 8.3.110.13-electron.0
OS: Linux x64 5.7.19

VSCode中报告的TypeScript版本：4.1.3-pnpify。

> cd my-project
> yarn --version
2.4.0

更新：我尝试将nodeLinker:node modules添加到。雅尔克。yml和当I重新加载窗口VSCode不再报告错误时，它会正确返回NodeJS。当我在我的测试中悬停时，处理。ts。这至少表明大多数设置应该是正确的，并且是唯一一个给VSCode带来麻烦的PnP。




Answer 1

这里是部分答案，因为这个页面是搜索yarn 2 vscode时的顶级结果。

TL；DR——据我目前的理解，让Thread 2在VSCode中工作的唯一方法是在一个文件夹工作区内。

在上下文中，我将yarn2设置为一个monorepo，并使用带有TypeScript的Create React应用程序——我到处都能看到红色的曲线，就像OP描述的那样，但在命令行中，一切都很好。

根据此处的纱线2说明：

将TypeScript添加到项目根目录：

yarn add -D typescript

运行SDK命令：

yarn dlx @yarnpkg/sdks vscode

这将添加SDK文件到. yarn/sdks，以及创建一个. vscode文件夹，其中包含以下setttings.json

{
  "search.exclude": {
    "**/.yarn": true,
    "**/.pnp.*": true
  },
  "typescript.tsdk": ".yarn/sdks/typescript/lib",
  "typescript.enablePromptUseWorkspaceTsdk": true
}

这里是我们试图指向VSCode要使用的TypeScript SDK的地方。

但是，如果您一直在多文件夹VS代码工作区中执行此操作（在这里您可以右键单击-

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

有关消息的讨论，请参阅Github问题。

我找到的解决方案是：

VScode-

我的Github问题概述了这个问题/解决方案。

Answer 2

虽然我已经接受了另一个答案，但我认为，如果我详细说明我最终是如何做到这一点的，这可能会对人们有所帮助。

>

1. npm安装-g纱线
2. cd~/path/to/project
3. 纱线集版本最新（或纱线集版本berry，但我用的是最新）

或者，如果你和我一样，在中使用nodeLinker:node modules。雅尔克。yml目前，您必须删除该行并运行纱线安装以使其返回纱线2的默认即插即用设置。x及以上。

至少需要在根项目中安装需要修补以使用即插即用的开发依赖项。我的根程序包的简化版本。json如下所示：

{
  "name": "root",
  "private": true,
  "devDependencies": {
    "prettier": "^2.4.1",
    "ts-node": "^10.2.1",
    "typescript": "^4.4.3"
  },
  "workspaces": [
    "packages/*"
  ],
  "packageManager": "yarn@3.0.2"
}

{
  "search.exclude": {
    "**/.yarn": true,
    "**/.pnp.*": true
  },
  "prettier.prettierPath": ".yarn/sdks/prettier/index.js",
  "typescript.tsdk": ".yarn/sdks/typescript/lib",
  "typescript.enablePromptUseWorkspaceTsdk": true
}

{
  "folders": [
    {
      "path": "."
    }
  ],
  "settings": {
    "search.exclude": {
      "**/.yarn": true,
      "**/.pnp.*": true
    },
    "prettier.prettierPath": ".yarn/sdks/prettier/index.js",
    "typescript.tsdk": ".yarn/sdks/typescript/lib",
    "typescript.enablePromptUseWorkspaceTsdk": true
  }
}

Answer 3

我昨晚在迁移到Thread v2并使用PnP时遇到了这个问题。

1. 确保运行yarn dlx@yarnpkg/sdks vscode后，在. yarn目录中创建了以下文件夹结构：. yarn/sdks/typecript/lib。
2. 更改VSCode工作区配置以添加以下内容：
   "typescript.tsdk"：". yarn/sdks/typecript/lib"

在monorepo中使用Thread工作区时，我还遇到了第1步的另一个问题，我要做的是安装typescript、prettier和eslint作为根包的依赖项（它通常没有任何依赖项）。在第二步，我将路径改为frontend/。纱线/SDK/typescript/lib