AOT 编译器生成错误的导入

Question

我有一个多应用程序 angular-cli 项目，其中包含一些代码库共享。

基本上，结构如下所示：

src - 主应用程序
- app.component - 自举组件
- app.module
- shared - 共享应用程序部分
  - demo.component
  - shared.module
extension - 第二个应用程序应该扩展主应用程序
- extension-app.component - 自举组件
- extension.module

SharedModule（声明并导出 DemoComponent）由 AppModule 和 ExtensionModule 导入。 DemoComponent 然后被添加到 AppComponent 和 ExtensionAppComponent 的模板中。

使用 JIT 编译器（ng serve、ng serve --app extension）时一切正常，但 AOT 编译器失败：

Can't resolve '../../../src/app/demo/demo.component.ngfactory'

在 GENDIR/app/demo/demo.component.ngfactory 查看这个生成的文件，我们得到以下信息：

import * as i0 from './demo.component.css.shim.ngstyle';
import * as i1 from '@angular/core';
import * as i2 from './demo.component';

最后一次导入是失败的，因为GENDIR/app/demo文件夹中没有'demo.component'。令人惊讶的是，作为 i0 导入的文件确实存在并且包含适当的样式。

更新：看起来问题出在 ngc。即使您在 tsconfig.json 中添加 paths 别名，它也不会起作用。 github (https://github.com/angular/angular/issues/13487)

上有几个关于它的问题

Answer 1

我运行今天遇到了类似的问题，我可以通过将 tsconfig.app.json 文件移动到我想使用的所有代码的祖先目录中来解决它。然后，我修改了 tsconfig.app.json 中的 include 数组，使其仅包含辅助应用程序。

注意： 我使用的是配置为构建多个应用程序的单个 .angular-cli.json。如果您有多种配置，您的里程可能会有所不同

对于您的示例，您可以尝试以下结构：

<父目录>
- src（主应用）
  - app.component - 自举组件
  - app.module
  - shared - 共享应用程序部分
    - demo.component
    - shared.module
- extension - 第二个应用程序应该扩展主应用程序
  - extension-app.component - 自举组件
  - extension.module
- tsconfig.extension.json - 扩展应用程序特定的 tsconfig 文件

在您的 tsconfig.extension.json 文件中，添加一个包含部分：

...
"include": [
    "./extension/**/*"
]
...

假设您在 .angular-cli.json 文件中声明了每个应用程序，您还需要为扩展应用程序更新 "tsconfig" 属性：

"name": "extension",
// Other configuration...
"tsconfig": <insert path to tsconfig based on "root" here>

READER 小心 这种结构有点像 hack，并且不受官方支持。如果未来的更新导致它自行崩溃，请不要感到惊讶！

正在进行：

AOT compiler generates wrong import