Yarn Monorepo中TypeScript导入建议正确但选中后无法插入的问题

问题复现场景 #

在Yarn Monorepo环境下，从packages/frontend/lib/src/components/LibButton/index.tsx导入组件时，VS Code能给出正确的自动导入建议LibButton @goe/lib，但选中建议后导入代码不插入，文件显示变更标记但无实际代码修改，同时TypeScript Server抛出报错：

2024-02-21 13:41:49.596 [error] <semantic> TypeScript Server Error (5.3.3-sdk)
Debug Failure.
Error: Debug Failure.
    at getAutoImportSymbolFromCompletionEntryData

解决方案 #

• 检查Monorepo的TypeScript配置

  1. 根目录tsconfig.json需开启composite: true，并配置正确的paths映射：

     {
       "compilerOptions": {
         "composite": true,
         "baseUrl": ".",
         "paths": {
           "@goe/lib": ["packages/frontend/lib/src"]
         }
       },
       "files": [],
       "references": [
         { "path": "./packages/frontend/lib" },
         { "path": "./packages/frontend/client" }
       ]
     }
     

  2. 子包（如packages/frontend/client）的tsconfig.json要继承根配置，并添加依赖包的引用：

     {
       "extends": "../../../tsconfig.json",
       "compilerOptions": {
         "outDir": "./dist"
       },
       "references": [{ "path": "../lib" }]
     }
     

• 验证Yarn工作区配置

  1. 运行yarn workspaces list确认@goe/lib已被工作区正确识别
  2. 执行yarn install重新生成依赖映射（Yarn 2+的PnP模式下，确保.pnp.cjs文件包含@goe/lib的包路径映射）

• 清除TypeScript缓存

  1. 在VS Code中打开命令面板（Ctrl+Shift+P），执行TypeScript: Restart TS Server
  2. 删除项目根目录下的所有.tsbuildinfo文件，以及本地TS缓存目录（如~/.cache/typescript/5.3.3，对应你的TS版本）

• 调整TypeScript版本

  1. 尝试降级到TypeScript 5.2.x稳定版，或升级到5.4+版本（该报错在部分TS版本中已被修复）
  2. 确保VS Code的TypeScript插件版本与项目依赖的TS版本一致（点击VS Code右下角的TS版本号切换）

• 临时Workaround
  手动添加导入语句绕过自动导入问题：

  import { LibButton } from '@goe/lib';
  

内容的提问来源于stack exchange，提问作者Yorutamashi