如何在VS Code中排除Angular工作区的重复导出建议？

一、解决VS Code导出建议重复问题 #

我的Angular工作区包含应用和库两个项目，库构建后输出到根目录dist/文件夹，通过public-api.js对外导出内容。目前VS Code会同时显示库源码和dist目录的重复导出建议，只想要保留dist版本的建议，可按以下步骤处理：

• 在工作根目录的tsconfig.json中，给compilerOptions添加paths映射，把库的包名直接指向dist编译产物：

  "compilerOptions": {
    "paths": {
      "@your-lib-name/*": ["dist/your-lib-name/*"]
    }
  }
  

• 修改应用项目的tsconfig.app.json，在exclude数组里加入库的源码目录，避免VS Code索引源码导出：

  "exclude": [
    "node_modules",
    "src/test.ts",
    "**/*.spec.ts",
    "../projects/your-lib-name"
  ]
  

• 重启VS Code的TypeScript服务：打开命令面板（Ctrl+Shift+P），执行TypeScript: Restart TS Server，让配置生效。

二、解决模板内自动导入总是用相对路径的问题（2024.08.24更新） #

组件外部的自动导入会遵循importModuleSpecifier和tsconfig设置，但在@Component的template属性内自动导入时，始终使用相对路径，不受配置影响，可尝试以下方案：

• 把库本地链接到应用：用npm link ../dist/your-lib-name，或者在应用的package.json中添加本地依赖"@your-lib-name": "file:../dist/your-lib-name"，让VS Code识别它为正式包而非本地源码。
• 更新Angular Language Service插件到最新版，旧版本可能存在模板导入路径处理的bug。
• 手动在模板中用包名导入目标内容，多次使用后VS Code会记住偏好，后续自动导入会优先选择包路径。
• 完善tsconfig.json的baseUrl和paths配置，确保模板解析时能正确映射到dist目录的包：

  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@your-lib-name": ["dist/your-lib-name"],
      "@your-lib-name/*": ["dist/your-lib-name/*"]
    }
  }
  

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