如何让VSCode自动导入node_modules中配置的TypeScript别名？

针对你遇到的Angular项目中@proto别名可正常工作但VSCode自动补全不识别的问题，可按以下步骤排查解决：

1. 优化路径别名配置写法 #

避免直接在paths中写node_modules路径，利用TypeScript的模块解析逻辑调整配置，让VSCode语言服务更容易识别：

{
    "compilerOptions": {
        "baseUrl": "./",
        "paths": {
            "@share/*": ["src/app/share/*"],
            "@proto/*": ["@atmlib/proto/grpc-web/web/*"]
        }
    }
}

由于baseUrl设为当前根目录，TypeScript会自动到node_modules中查找@atmlib开头的模块，这种写法更符合规范，也能提升VSCode对别名的识别度。

2. 重启TypeScript语言服务 #

VSCode的TypeScript语言服务可能缓存了旧配置，强制重启刷新：

• 打开命令面板（Windows/Linux：Ctrl+Shift+P；Mac：Cmd+Shift+P）
• 输入并执行 TypeScript: Restart TS Server

3. 确认VSCode使用项目本地TypeScript版本 #

全局TypeScript版本可能和项目依赖版本不一致，导致识别问题：

• 打开命令面板，输入 TypeScript: Select TypeScript Version
• 选择Use Workspace Version（即项目node_modules中的TypeScript版本）

4. 检查排除规则与扫描范围 #

• 确保tsconfig.json的exclude数组没有排除@atmlib相关目录
• 若上述步骤无效，可尝试在include中明确添加目标路径（仅用于排查，不建议长期保留）：

{
    "include": [
        "src/**/*",
        "node_modules/@atmlib/proto/grpc-web/web/**/*"
    ]
}

5. 验证配置生效 #

修改配置后，尝试在组件中输入@proto/开头的路径，查看VSCode是否弹出自动补全提示。

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