Angular中如何为外部库配置原有路径别名

1. 优化库的package.json（推荐方案） #

在你的core-project库的package.json里添加exports字段，明确对外暴露的模块入口，这样主项目里不用写node_modules这类硬编码路径：

{
  "name": "core-project",
  "exports": {
    "./shared": "./shared/index.js",
    "./shared/*": "./shared/*",
    "./core": "./core/index.js",
    "./core/*": "./core/*"
  },
  "types": {
    "./shared": "./shared/index.d.ts",
    "./shared/*": "./shared/*",
    "./core": "./core/index.d.ts",
    "./core/*": "./core/*"
  }
}

之后主项目的tsconfig路径别名就能简化成：

"@shared": ["core-project/shared"],
"@shared/*": ["core-project/shared/*"],
"@core": ["core-project/core"],
"@core/*": ["core-project/core/*"]

这么做的好处：

• 不用硬写node_modules路径，完全符合Node.js模块解析规范
• 库自己定义对外暴露的入口，主项目不用依赖库的内部目录结构，后续库调整结构时主项目不用改配置

2. 简化主项目tsconfig配置（无需修改库） #

如果暂时不想动库的配置，可以调整主项目的tsconfig路径规则，去掉node_modules路径：

"@shared/*": ["core-project/shared/*"],
"@core/*": ["core-project/core/*"]

前提是你的core-project打包后，shared和core目录直接在库的根目录下（也就是node_modules/core-project/shared确实存在），TypeScript会自动去node_modules里查找匹配的模块。

之前配置失效的原因 #

• 失效配置1：只配了@shared的根路径，没配@shared/*通配规则，导致@shared/modals这种子路径无法匹配到正确文件
• 失效配置2：指向了源码目录src/shared，但你安装的是打包后的库，node_modules里根本没有这个源码目录，自然找不到文件

额外要注意的点 #

• 打包core-project时，要确保shared、core目录的编译产物（包括类型文件.d.ts）都输出到库的根目录，否则TypeScript会找不到类型定义
• 如果用webpack、Vite这类构建工具，要确保它们能识别tsconfig的路径别名，比如webpack可以用tsconfig-paths-webpack-plugin，Vite自带支持tsconfig路径

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