Angular库自定义导入路径报错，构建成功但ng serve失败求助

看起来你遇到的核心问题是：开发模式下（ng serve）消费项目会直接读取库的源代码，而消费项目的TypeScript配置并不识别你在库的tsconfig.lib.json里定义的@services别名——虽然库本身构建正常（构建时ng-packagr会自动处理别名替换），但开发时直接引用源码就会触发路径解析失败。

下面是一步步的修复方案：

1. 确认库的tsconfig.lib.json配置正确性 #

首先确保你的tsconfig.lib.json配置没有问题，重点核对baseUrl和paths的匹配关系：

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "baseUrl": "src", // 相对于library目录的src文件夹，这个配置是对的
    "paths": {
      "@services": ["lib/services/index.ts"] // 明确指向services的入口文件，避免模糊匹配
    },
    "declaration": true,
    "module": "es2020",
    "target": "es2020",
    // 其他编译选项...
  },
  "include": ["src/**/*"],
  "exclude": ["src/test.ts", "src/**/*.spec.ts"]
}

同时检查library/src/lib/services/index.ts是否正确导出了所有服务，比如：

export * from './auth.service';
export * from './data.service';
// 导出所有需要在库内部引用的服务

2. 让消费项目在开发模式下识别别名 #

因为ng serve时消费项目直接引用库的源码而非编译产物，所以需要让消费项目的TypeScript配置能解析@services。最优雅的方式是在根目录的tsconfig.json中添加全局路径配置，这样所有消费项目都会自动继承：

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@services": ["projects/library/src/lib/services"]
    }
  },
  "exclude": ["node_modules", "dist"]
}

这样做的好处是：

• 库内部依然可以使用简洁的@services别名
• 所有消费项目在开发模式下能正确解析路径
• 库构建后，ng-packagr会自动将别名替换为相对路径，消费项目运行时不需要额外配置

3. 验证库的构建配置 #

检查你的angular.json中库的build配置，确保它使用的是正确的tsconfig文件：

{
  "projects": {
    "library": {
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:ng-packagr",
          "options": {
            "tsConfig": "projects/library/tsconfig.lib.json",
            "project": "projects/library/ng-package.json"
          }
        }
      }
    }
  }
}

4. 清理缓存并重启服务 #

最后，清理Angular的缓存并重启开发服务，确保配置生效：

ng cache clean
ng serve

这样调整后，你既能在库内部使用简洁的@services别名，又能解决ng serve时的模块找不到问题，同时消费项目不需要单独配置路径。

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