I’ve spent the last 2 days on debugging a white screen issue in my Ionic 8 Angular app. In production builds, the page is rendered but not visible. When I launch ionic serve all works well. In prod build the DOM shows the correct content, but it’s wrapped in a div with class=“ion-page ion-page-invisible”.
Things I’ve tried:
Removing all guards
Removing early redirects (e.g. from ‘’ to /language)
Adding manually to routed components
Disabling animations via provideIonicAngular({ animated: false })
Forcing removal of ion-page-invisible via querySelector().classList.remove()
Simplyfying the app to minimum and using only two simple routes (language and welcome) with clean layout
Verified that the component renders (dummy h1 text exists in DOM), but stays hidden
The issue:
Ionic applies ion-page-invisible and never removes it after navigation. Even disabling animations and using a minimal setup doesn’t solve it.
Has anyone encountered this in Ionic 8 with standalone Angular components? I saw many posts about similar issue in the past but with no exact solution. Any idea how to force the page to become visible or work around this bug properly?