问题标签 [angular-aot]

我在本地机器上有一个 Angular 项目，它使用 Angular AOT 构建没有错误，并在服务器上成功运行。但是，当您克隆项目 repo 并在运行 npm install 后运行相同的构建脚本时，它构建没有错误，但是当您访问该站点时，您会收到：

我尝试查找错误，它似乎与socket.io有关。我没有直接在我的项目中使用 socket.io。我发现导致错误的 node_modules 存在差异，因为我在没有运行 npm install 的情况下将工作的 node_modules 复制并粘贴到了一个新的克隆中，并且在构建之后，一切正常工作。

我的问题是如何筛选每个项目中的 node_modules 以找出错误的罪魁祸首？

在 angular5 上，我尝试对我的大部分模块/组件进行同一个项目的 AOT 编译......但我有一部分需要 JIT 编译。

对于第二部分，HTML 来自 Ajax 请求并包含一些必须由 angular 编译的组件标记。为了管理这部分，我使用如下指令：

如您所见，我可以调用addHtmlComponent方法在运行时使用自定义 HTML 作为模板编译新组件。

我的模板看起来像：

一切正常，直到我切换到 AOT 编译（仅供参考：https ://github.com/angular/angular-cli/tree/master/packages/%40ngtools/webpack ）

可能的原因： 我猜主要原因是因为 AOT 编译从输出编译包中删除了 Angular 的“编译器”部分。 我尝试过 的 - 我尝试直接在我的代码上要求它，但仍然不存在。- 我试图检查像角度（或角度材料）这样的网站如何处理它。但不适合我的情况。事实上，两者都已经编译了 AOT 版本中的所有示例。动态部分是样本周围的“只是”内容。

如果您想检查角度材料是如何做到的：每个组件的所有网站示例：https ://github.com/angular/material2/tree/master/src/material-examples

然后他们有加载器： https ://github.com/angular/material.angular.io/blob/master/src/app/shared/doc-viewer/doc-viewer.ts#L85

这可能是正确的方法，但我不知道如何调整它来管理动态标签内容。

编辑：我在这里添加了示例：https ://github.com/yanis-git/aot-jit-angular （分支大师）

正如您将看到的，AOT 编译从包中删除了墙编译器，结果如下：

我试图在 AppModule 上强制编译器工厂，但仍然没有结果。

我在同一个 repo 上有另一个示例，但是在分支“lazy-jit”上，现在我在输出的包中嵌入了编译器，但是出现了新错误：

谁看起来与这个问题完全相同：https ://github.com/angular/angular/issues/16033

使用ng serve --aot命令在 AOT 模式下运行 Angular 应用程序（在浏览器中点击应用程序 url）时出现以下错误。请注意，在 aot 模式下构建应用程序时我没有收到任何错误。当我点击应用程序 url 时，我在浏览器中收到此错误。

此问题的任何解决方案都会有所帮助。

代码

当我运行它时，我收到了一个错误Unexpected value 'ThridModule' import by module 'AppModule'。请添加 @NgModule 注释。

我该如何解决这个问题？

我有多个模块，每个模块都包含各种组件，以及需要包含这些组件之一的父组件。

由于我无法使用路由来实现这一点，因此我编写了一个服务，它给出了 amoduleName :string和 acompomnentName : string返回相应的组件类。

请参阅此 stackblitzComponentDirectoryService。

我模仿路由器模块如何允许功能模块注入自己的路由：

• ComponentDirectoryModule有一个值被传递到forRoot的forChild方法DIRECTORY_ENTRIES
• 每个功能模块（stackblitz 中的 p1 和 p2）调用forChild以提供其DIRECTORY_ENTRIES
• AppModule 调用forRoot，它提供ComponentDirectoryService传入的累积（调用forChild）值DIRECTORY_ENTRIES

在开发模式下一切正常。

在生产模式下一切正常，但我收到了这个可怕的警告：

无法解析 ...component-directory.service.ts: (?) 中 ComponentDirectoryService 的所有参数。这将成为 Angular v6.x 中的错误

令我困惑的是，服务的唯一参数是目录条目......

编辑 1

就像 Angular 声明 ROUTES 注入令牌一样：

export const ROUTES = new InjectionToken<Route[][]>('ROUTES');

我对 DIRECTORY_ENTRIES 也是如此：

export const DIRECTORY_ENTRIES = new InjectionToken<ComponentDirectoryEntry[][]>('DIRECTORY_ENTRIES');

我想将一个组件导入 Angular 4.4.6 中的另一个组件。这可能最终只是一个理论上的答案，这很好。只是想我会伸出手来看看是否有人这样做。我通常只会为组件等创建一个模块，但我真的想删除任何额外的文件 - 试图避免文件异味。

我没有真正的代码可以分享，尽管我正在描绘这样的事情：

我这样做已经在整个应用程序的几个地方引入了外部组件，例如与 @ViewChild() 的父/子通信，所以我明白了。只是想知道如果不使我需要在 HTML 中访问的组件全局可用，或者我是否必须创建一个模块并像往常一样导入它，这是否可能。谢谢！！

在 Angular 的网站上，我读到默认编译是 JIT：

https://angular.io/guide/aot-compiler

我想当它在 Angular 官方网站上时，它必须是 JIT，但在许多其他页面上，我读到 AOT 是 Angular 5 中的默认编译。

这让我有点困惑。在这个问题中，它还说 AOT 是默认值：AOT 编译是 angular@4.0.0 上的默认值吗？

现在什么是真的？

我收到多个错误，但它们都与此类似：

这些错误似乎只发生在作为子模块的模块中，因为材料按钮正在其他组件中使用而不会产生此错误。我怀疑我对导入做了一些愚蠢的事情，但我不知道是什么会导致仅在子模块中出现此错误。角度编译器版本是 5.2.10。

进口 -

它适用于 webpack 并执行“npm run server”。只有在进行 AOT 编译时才会出现问题。

我的组件有这个变量

我在我的 html 文件中使用它

我收到了这个错误

这是什么意思？我只有这个

“ng serve”完美运行

当我想使用以下包版本在 AOT 中编译我当前的项目时，我遇到了问题：

• @ngtools/webpack@6.0.3
• @angular@latest (6.0.2)
• Webpack@4.0.0

我的 webpack 和 tsconfig.json 配置可以在这里找到

我遇到了一些与模板上使用的private/protected范围相关的问题，以及一些提取参数提供给一些真正不需要它的函数（例如未在 EventBinding 上使用的 $event）。

现在我有以下列表，我找不到我的问题在哪里：

/path/to/app/header/main-header/main-header.component.html(85,7): : 指令 TableOfContentComponent，预期 0 个参数，但得到 1。 (1,1): : 指令 TableOfContentComponent，预期 0争论，但得到 1。

我的main-header.component.html文件包含：// main-header.component.html

而且 myTableOfContentComponent不包含任何@Input属性。

/path/to/app/header/main-header/hamburger-menu/hamburger-menu.component.html(125,5): : 指令 SliderComponent，预期 0 个参数，但得到 1 个。 (1,1): : 指令SliderComponent，预期 0 个参数，但得到 1 个。

我hamburger-menu.component.html的代码接近上述代码：

我的SliderComponent样子：

/path/to/app/header/main-header/medias/dialogs/image-dialog.component.html(34,5): : 指令 CarouselComponent，预期 0 个参数，但得到 1. (1,1): : 指令CarouselComponent，预期 0 个参数，但得到 1 个。

真的很接近前一个，我认为问题是一样的。

/path/to/app/document/page/page.component.html(7,9): : 指令 InfinityPageScrollComponent，预期 0 个参数，但得到 1。 (1,1): : 指令 InfinityPageScrollComponent，预期 0 个参数，但得到1.

在这里我们没有任何输入InfinityPageScrollComponent，标签是这样调用的<ps-infinity-page-scroll></ps-infinity-page-scroll>

我准确地说，当我在我的 webpack 上禁用 AOT 时，一切都像魅力一样工作。

我试图在AoT Do's 和 Don'ts上找到解决方案，但没有任何结果。

我还注意到，如果我禁用fullTemplateTypeCheck我将面临大约 18 000 个错误，其中包含一些隐含的任何类型以及更奇怪、未定义的属性，用于在构造函数上声明的服务。

--- 编辑 1：为抽象类提供代码：UnsubscribeHelper---

抽象类的代码UnsubscribeHelper：