❓[SUPPORT]: Angular 11 already supports hmr, is ngxs considering following up?

[Y2zz]

https://blog.angular.io/version-11-of-angular-now-available-74721b7952f7

[mb590721]

We are very interested in this feature too, HMR is a key to faster development on huge web application.
Any idea if this is planned ?

[markwhitfeld]

I have asked @splincode to look into it.
We will have some feedback soon about re-introducing this plugin.

[splincode]

@Y2zz works for me, if something doesn't work for you, please provide an example to reproduce

[krtek4]

Hello,

I had a HMR setup that worked well with Angular 10 using the ngxs/hmr-plugin. After migrating to Angular 11, without changing anything, I had the following error : [HMR] Update failed: Error: Injector has already been destroyed.

After removing the code related to the HMR plugin, the error was gone, but my states weren't saved through reload.

What are the steps to make everything work as before ?

[markwhitfeld]

@krtek4 Is it possible to provide a small reproduction of your issue?
@splincode could you have a look into this?

[krtek4]

@markwhitfeld not sure it is an issue per se, probably more of a "how to do things now that Angular has HMR"

Not on my work computer right now and stackblitz doesn't seem to properly support HMR, will try to get back to you in the next few days with a repo.

[krtek4]

Hello @splincode , @markwhitfeld

I created a repository with various branches : https://github.com/krtek4/hmr-tests

• mastger : HMR correctly reload the page, but the state are reset to their default
• hmr-plugin-10 : the "working version" with Angular 10 where the state remains between HMR refreshes
• hmr-plugin-11 : HMR plugin is activated with Angular 11 this time, the page goes blank upon refresh and there's an error in the console
• hmr-plugin-11-bis : HMR stuff in main.ts are removed, HMR correctly reload the page but the state is reset

The steps to reproduce are in the README.md file each time, and in the pull requests. You can also see that the changes between the branches are minimal each time and just related to HMR and the plugin.

Happy to help further if I can.

[krtek4]

Hey @splincode , @markwhitfeld,

Any news on this ? I can probably work on this if you don't have time, just that I don't want to waste time if you already have something planned.

Just tell me how I can help :)

[splincode]

@krtek4 have not watched yet, you can study this moment yourself

[Y2zz]

I think this may be different from what we understand HMR

[krtek4]

@Y2zz what do you mean ?

HMR itself works fine in Angular 11, with or without NGXS.

The thing that changed is that in Angular 10 and below, using the HMR plugin, data in the stores were restored upon reload, now the plugin does not work, for logical reasons.

What is your issue ?