Angular CLI 9 (Ivy) 使用本地库 (mono-repo) 构建应用程序失败

Posted 2023-03-24

【中文标题】Angular CLI 9 (Ivy) 使用本地库 (mono-repo) 构建应用程序失败

【英文标题】：Angular CLI 9 (Ivy) App build with local library (mono-repo) failing

【发布时间】：2020-07-13 16:32:25

【问题描述】：

我有一个 Angular 9 应用程序，我开始将一些组件移动到一个专用库项目中，该项目使用辅助入口点（试图模仿 Angular Material 的方法）。如果我使用 Ivy 编译器构建库和应用程序，一切都可以正常构建，但如果使用 --prod 标志构建两者（这会导致在没有 Ivy 的情况下构建库），应用程序构建会失败并出现以下错误：

Compiling @fabric/components/breadcrumbs : es2015 as esm2015

ERROR in node_modules/@fabric/components/breadcrumbs/fab-breadcrumbs.module.d.ts:1:22 - error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class.

This likely means that the library (@fabric/components/breadcrumbs) which declares FabBreadcrumbsModule has not been processed correctly by ngcc, or is not compatible with Angular Ivy. Check if a newer version of the library is available, and update if s
o. Also consider checking with the library's authors to see if the library is expected to be compatible with Ivy.

1 export declare class FabBreadcrumbsModule 
                       ~~~~~~~~~~~~~~~~~~~~

我尝试更新到最新版本 (9.0.2 -> 9.1.0)，但它仍然在做同样的事情。我尝试用一​​个全新的超级简单的 mono-repo 项目重新创建它，但在这种简单的情况下它工作正常。我比较了我的应用程序和简单工作应用程序之间的 tsconfig 和 angular.json 配置文件，但它们几乎相同。所以我有点卡住了。我不确定是什么导致了这种情况，无论是在 ng-packagr 端，没有正确构建库，还是在应用程序端的 angular-build 被搞砸了。任何建议将不胜感激！

【问题讨论】：

抱歉不知道，但很好奇：为什么 Ivy 在产品构建中被禁用？

@Mic 它对 prod 库构建禁用，因为期望您最终会将其发布到 npm，而 Angular 当前的建议是发布已使用旧视图编译的库引擎，因此它们具有更广泛的兼容性。

【参考方案1】：

通过一些故障排除以及 Angular 团队的 Pete 提供的其他信息，我终于能够找出问题的根本原因。想在这里更新，以防其他人遇到同样的情况。这里的主要问题是我的 tsconfig.app.json 是 ng 编译器在 ng 构建运行期间使用的，它嵌套在 src 文件夹的下一层，而不是在我的项目的根目录中。这意味着，它无法访问我的库正在构建的 ./dist 文件夹。因此，即使我的主 tsconfig 正确定义了指向 ./dist lib 文件夹的路径，应用程序构建也无法访问它。不幸的是，错误消息不是很好，所以花了很多时间才弄明白。

升级到 Angular 10 后出现半相关问题，将项目中的 tsconfig 组织更改为“解决方案样式布局”，将主项目 tsconfig.json 重命名为 tsconfig.base.json。这会抛出 ngcc 编译器，它假定基本 tsconfig 只是 tsconfig.json。因此，如果您将 ngcc 设置作为安装后步骤，那么如果您在 tsconfig.base 中定义了路径，那将无法正常工作。解决方案是在 ngcc 安装后调用中添加一个 --tsconfig 标志，将其指向您的 tsconfig.base.json。