bug: Live reload not working using Angular 19.1.1

[emnljs]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v8.x

Current Behavior

When using Ionic and Angular, during ionic serve, changes on the code does not trigger live reload. Also, some instances render white page removing all elements on save.

Expected Behavior

Page should reload upon code change automatically

Steps to Reproduce

1. ionic start my-app
2. Choose Angular, standalone or NgModule
3. ionic serve
4. Change anything on the code
5. Save changes

Code Reproduction URL

https://github.com/emnljs/no-live-reload

Ionic Info

Ionic:

Ionic CLI : 7.2.0 (/Users/digitechdept/.nvm/versions/node/v20.17.0/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 8.4.1
@angular-devkit/build-angular : 19.1.1
@angular-devkit/schematics : 19.1.1
@angular/cli : 19.1.1
@ionic/angular-toolkit : 12.1.1

Capacitor:

Capacitor CLI : 6.2.0
@capacitor/android : not installed
@capacitor/core : 6.2.0
@capacitor/ios : not installed

Utility:

cordova-res : 0.15.4
native-run : 2.0.1

System:

NodeJS : v20.17.0 (/Users/digitechdept/.nvm/versions/node/v20.17.0/bin/node)
npm : 10.8.2
OS : macOS Unknown

Additional Information

No response

[RaulGM3]

I have the same problem. I want to add that saves actually trigger a rebuild from the dev bundle, and it even sends them to the client. But for however reason these changes are not triggered within the browser (I have not tried the mobiles yet). changes within app.component files work, but not in the home.page or any other component that I've created.

Here I share the ionic serve --verbose and change tabs1.page.html. First, it listens to the save perfectly, adds it to modified array ok, then, we got this [DEBUGS] and then it says that Component update sent to client(s).

2025-01-17T14:14:44.113Z vite:time 11.58ms ../../cache/19.1.1/app/vite/deps/ionicons_icons.js.map
[ng] {
[ng]   "added": [],
[ng]   "modified": [
[ng]     "/Users/myuser/Developer/MY-PROJECT/test/src/app/tab1/tab1.page.html"
[ng]   ],
[ng]   "removed": []
[ng] }
[ng] ❯ Changes detected. Rebuilding...

[ng] ● [DEBUG] This "import" expression will not be bundled because the argument is not a string literal [unsupported-dynamic-import]
[ng]     src/app/app.component.ts:14:44:
[ng]       14 │ (() => { function AppComponent_HmrLoad(t) { import(/* @vite-ignore */
[ng]          ╵                               ~~~~~~
[ng] ● [DEBUG] This "import" expression will not be bundled because the argument is not a string literal [unsupported-dynamic-import]
[ng]     src/app/tab1/tab1.page.ts:24:40:
[ng]       24 │ (() => { function Tab1Page_HmrLoad(t) { import(/* @vite-ignore */
[ng]          ╵                                         ~~~~~~

[ng] ✔ Changes detected. Rebuilding...
[ng] Initial chunk files     | Names       | Raw size
[ng] main.js                 | main        |  2.35 kB | 
[ng] Lazy chunk files        | Names       | Raw size
[ng] tabs.routes-RCPPXRVE.js | tabs-routes |  3.52 kB | 
[ng] tab1.page-UHEKCDIP.js   | tab1-page   |  2.43 kB | 
[ng] Application bundle generation complete. [0.156 seconds]
[ng] Component update sent to client(s).

[RaulGM3]

I read your message again and made all the sense. We are running ionic 7.2 with angular 19. Upgrade it to Ionic 8 and fixes the problem.

[digitechdept]

I read your message again and made all the sense. We are running ionic 7.2 with angular 19. Upgrade it to Ionic 8 and fixes the problem.

do you mean update the ionic cli to 8?

[RaulGM3]

npm install @ionic/angular@latest
npm install @ionic/angular@latest @ionic/angular-server@latest @ionic/angular-toolkit@11
npm install @ionic/core@8

That's all I did.

[emnljs]

updating to 19.1.3 for angular dev-kit works

Ionic:

   Ionic CLI                     : 7.2.0 
   Ionic Framework               : @ionic/angular 8.4.1
   @angular-devkit/build-angular : 19.1.3
   @angular-devkit/schematics    : 19.1.3
   @angular/cli                  : 19.1.3
   @ionic/angular-toolkit        : 12.1.1