Question

我有一个带有一些代码库共享的多应用程序angular-cli项目。

基本上，结构如下：

src - 主要应用程序
- app.component - 引导组件
- 的 app.module
- 共享 - 共享应用程序部分
  - 的 demo.component
  - 的 shared.module
扩展程序 - 第二个应用程序应该扩展主要应用程序
- 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';

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

更新：问题出现在ngc中。即使您在paths中添加tsconfig.json别名，它也无法正常工作。在github上有一些问题（https://github.com/angular/angular/issues/13487）

Answer 1

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

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

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

＆lt;父目录＆gt;
- src （主要应用）
  - app.component - 引导组件
  - 的 app.module

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

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

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

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

READER BEWARE 这种结构是一种黑客攻击，并没有得到官方的支持。如果未来的更新导致其自身崩溃，请不要感到惊讶！

继续工作：

节点：v8.4.0

npm：5.4.2

@ angular / cli：1.4.2

AOT编译器生成错误的导入

1 个答案: