Live Reload not working on .html files in Ionic with Angular 19

I just create my first Ionic project with Angular 19, when I run the project by using ionic serve the browser do not reload the .html files changes, while if the change is made in .ts it does.

For example in my component.html I change <ion-title>Test<ion-title> to <ion-title>Johnny<ion-title> and save the file.

2025-01-16T10:38:02.696Z vite:time 9.82ms ../../cache/19.1.0/app/vite/deps/ionicons_icons.js.map
[ng] {
[ng] "added": [],
[ng] "modified": [
[ng] "D:\\Capacitor\\visualbill\\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/tab3/tab3.page.ts:24:40:
[ng] 24 │ (() => { function Tab3Page_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/tab2/tab2.page.ts:24:40:
[ng] 24 │ (() => { function Tab2Page_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/tabs/tabs.page.ts:31:40:
[ng] 31 │ (() => { function TabsPage_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:30:40:
[ng] 30 │ (() => { function Tab1Page_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/explore-container/explore-container.component.ts:23:57:
[ng] 23 │ ...n ExploreContainerComponent_HmrLoad(t) { import(/* @vite-ignore */
[ng] ╵ ~~~~~~
[ng] ✔ Changes detected. Rebuilding...
[ng] Initial chunk files | Names | Raw size
[ng] main.js | main | 2.54 kB |
[ng] Lazy chunk files | Names | Raw size
[ng] tabs.routes-KORZWXJX.js | tabs-routes | 3.52 kB |
[ng] tab1.page-B3H4W5Q2.js | tab1-page | 2.86 kB |
[ng] Application bundle generation complete. [0.141 seconds]
[ng] Component update sent to client(s).


But the browser did not reflect any change.

I use latest Chrome version and tried to enable Update on reload in Service workeres and even tried to use Edge instead, but noone of that has worked.

Continue reading...