HMR 使用 Angular 9 + IVY 失败：类型 AppComponent 是 2 个模块声明的一部分：AppModule 和 AppModule答案

【问题标题】：HMR fails with Angular 9 + IVY: Type AppComponent is part of the declarations of 2 modules: AppModule and AppModuleHMR 使用 Angular 9 + IVY 失败：类型 AppComponent 是 2 个模块声明的一部分：AppModule 和 AppModule
【发布时间】：2020-05-31 03:32:15
【问题描述】：

受影响的包

HMR + 常春藤

这是回归吗？

pre-IVY，它有效

说明

似乎 IVY 和 HMR 配合得不好？但是我看到他们的门票是关闭的，所以我想应该是可能的。我在代码更改后重新加载：

未处理的 Promise 拒绝：类型 AppComponent 是 2 个模块的声明：AppModule 和 AppModule！请考虑将 AppComponent 移动到导入 AppModule 的更高模块和应用模块。你也可以创建一个新的 NgModule 来导出和包括 AppComponent 然后在 AppModule 中导入该 NgModule 和应用模块。背景类型是 2 个模块声明的一部分：AppModule 和应用模块！请考虑将背景移至更高的模块导入 AppModule 和 AppModule。你也可以新建一个导出并包含背景的 NgModule 然后导入 AppModule 和 AppModule 中的 NgModule。

...

我们可以看到其他人如何进行更好的调查： https://www.gitmemory.com/issue/storybookjs/storybook/8494/551763214

????当前环境

角度版本：

ng 9.0.1

cli 9.0.1

【问题讨论】：

您找到解决问题的方法了吗？
还没有，亲爱的@SimonDragsbæk：/

标签： angular webpack-hmr hot-module-replacement angular9 angular-ivy

【解决方案1】：

在 angular.json 配置文件中切换 AOT，应该这样做

这里是 where 的结构：

{
  "projects": {
    "x": {
      "architect": {
        "build": {
          "options": {
            "aot": true,
          },
          "configurations": {
            "local": {
              "aot": true
            },

或者，仅出于测试目的，您可以使用 aot 标志运行

ng serve --aot=true

更新

请注意，这只是修复，因此您现在可以实际处理您的项目。 Angular 团队正在研究解决方案，以便我们能够尽快恢复对 HMR 的全面支持。

在此处查看 angular repo 中的相关问题 https://github.com/angular/angular/issues/35265

公关人员在这里修复它（仍在草稿中） https://github.com/angular/angular/pull/37474

【讨论】：

太好了，亲爱的西蒙。这个配置对我有用：我知道 hmr 现在必须可以像 IVY 一样在 build AoT 中运行。
它为我触发了整页重新加载...无法正常工作。
@TetraDev 但是您是否仍然收到错误消息：“Type AppComponent is part of the declarations of 2 modules...” - 另一部分是关于正确配置 HMR，尝试使用 angularclass /hmr 回购以获取更多信息
@TetraDev 我已经更广泛地研究了这个问题并相应地更新了这个答案。
@SimonDragsbæk 我没有收到任何其他错误。每次 HMR 更新时都会重新加载完整的模块依赖关系树。几乎在 2020 年的整个时间里都要处理这个问题！