无法从 Angular monorepo 中的对等库导入模块

Question

背景

我们有一个 monorepo Angular UI 组件库，并且正在尝试引入 Lerna 6。

问题

尝试构建依赖于 monorepo 的对等库的库之一时编译失败。

✖ Compiling with Angular sources in Ivy partial compilation mode.
src/lib/components/gauge/gauge.component.ts:13:33 - error TS2307: Cannot find module '@ui-lib/core' or its corresponding type declarations.

我们正在使用：

• 勒纳6
• 角度13
• npm 8

请注意，我们正在使用 npm 工作区。

项目结构

为了简洁而减少。

|-projects
|---ui-lib
   |---core
       |----ng-package.json
       |----package.json
       |----tsconfig.lib.json
   |---charts
       |----ng-package.json
       |----package.json
       |----tsconfig.lib.json
|-angular.json
|-package.json
|-dist
  |---ui-lib
     |---core

图表片段

package.json

：

"dependencies": {
        "@ui-lib/core": "file:../core",
        "tslib": "^2.0.0"
}

根片段

package.json

：

"workspaces": [
    "./projects/ui-lib/*"
]

lerna.json

的片段：

{
    "$schema": "node_modules/lerna/schemas/lerna-schema.json",
    "version": "independent",
    "useWorkspaces": true,
    "workspaces" : [
        "projects/ui-lib/*"
    ]
}

tsconfig.lib.json

用于图表库：

{
    "extends": "../../../tsconfig.json",
    "compilerOptions": {
        "outDir": "../../../out-tsc/lib",
        "target": "es2015",
        "module": "es2015",
        "moduleResolution": "node",
        "declaration": true,
        "sourceMap": true,
        "inlineSources": true,
        "experimentalDecorators": true,
        "importHelpers": true,
        "types": [],
        "lib": [
            "dom",
            "es2015"
        ]
    },
    "angularCompilerOptions": {
        "skipTemplateCodegen": true,
        "strictMetadataEmit": true,
        "fullTemplateTypeCheck": true,
        "strictInjectionParameters": true,
        "flatModuleId": "AUTOGENERATED",
        "flatModuleOutFile": "AUTOGENERATED"
    },
    "exclude": [
        "src/test.ts",
        "**/*.spec.ts"
    ]
}

图表库中的组件导入一个模块，如下所示：

import {isNullOrUndefined} from '@ui-lib/core';

这就是编译问题发生的地方。

我的背景更多是服务器端，所以我不是 npm 或 Angular 的高级用户，但我很难在这些工具的文档中找到我们在建立库之间的依赖关系时出错的地方。

任何帮助将不胜感激。

问候，

Answer 1

我们的解决方案实际上是更新根

tsconfig.json

文件

paths

以针对每个库的

dist

。每个库自己的

tsconfig.lib.json

文件都会扩展根

tsconfig.json

文件。

根

tsconfig.json

文件的片段：

"paths": {
      "@angular/*": [
        "./node_modules/@angular/*"
      ],
      "@ui-lib/core": [
        "projects/ui-lib/core/dist"
      ]
}

我们为每个具有编译对等依赖关系的库添加了一个路径。