9

Affected Package

HMR + IVY

Is this a regression?

pre-IVY, it works

Description

Seems IVY and HMR don't play well together? However I've seen tickets of them that are closed so I suppose it should be possible. I have on re-load after code change:

Unnhandled Promise rejection: Type AppComponent is part of the declarations of 2 modules: AppModule and AppModule! Please consider moving AppComponent to a higher module that imports AppModule and AppModule. You can also create a new NgModule that exports and includes AppComponent then import that NgModule in AppModule and AppModule. Type Background is part of the declarations of 2 modules: AppModule and AppModule! Please consider moving Background to a higher module that imports AppModule and AppModule. You can also create a new NgModule that exports and includes Background then import that NgModule in AppModule and AppModule.

...

We can see how others investigated better: https://www.gitmemory.com/issue/storybookjs/storybook/8494/551763214

Current Environment

Angular Version:

ng 9.0.1

cli 9.0.1

R. Richards
  • 24,603
  • 10
  • 64
  • 64
1antares1
  • 1,146
  • 2
  • 11
  • 19

1 Answers1

5

Toggle on AOT in your angular.json config file, that should do it

Here is the structure of where:

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

Alternatively, just for testing purposes, you can run with the aot flag instead

ng serve --aot=true

Update

As of Angular version 11 it is fully functional again

## Update

Note this is only fixing so you can actually work on your project, for now. The angular team is working on a solution so we can get our fully HMR support back, hopefully very soon.

Look here for the related issue in the angular repo https://github.com/angular/angular/issues/35265

And here for the PR put out to fix it (still in draft) https://github.com/angular/angular/pull/37474

Simon Dragsbæk
  • 2,367
  • 3
  • 30
  • 53
  • Excellent, Dear Simon. This configuration worked for me: I understand that hmr must now be available to run in build AoT as IVY by default does. – 1antares1 Mar 02 '20 at 16:18
  • It triggers a full page reload for me...not working right. – TetraDev Apr 30 '20 at 02:10
  • @TetraDev but do you still get the error message: "Type AppComponent is part of the declarations of 2 modules..." - The other part is about configuring HMR correctly, try to hit up the angularclass/hmr repo for more information – Simon Dragsbæk Jul 07 '20 at 13:00
  • @TetraDev I have looked into the issue a bit more extensively and updated this answer accordingly. – Simon Dragsbæk Jul 13 '20 at 14:25
  • @SimonDragsbæk I didn't get any other errors. Just full module dependency tree gets reloaded on each HMR update. Awful to deal with this for nearly all of 2020! – TetraDev Aug 14 '20 at 17:47
  • @TetraDev which is awful and I think this answer should serve as a "status page" for the issue In question – Simon Dragsbæk Aug 17 '20 at 06:50
  • @SimonDragsbæk I agree. Come on team Angular, you can do it! – TetraDev Nov 12 '20 at 19:42
  • @TetraDev It got fixed by ng11 but you might already know this – Simon Dragsbæk Mar 09 '22 at 12:13