White screen after splashscreen.hide()

Ionic Framework ionic-v3
1

Hello,
I get a white screen after my app loads (specifically when splash invokes “hide()” ), and it doesn’t just go away, no matter how much I’ll wait it will stay there, however, it does go away and calls the main page whenever I exit (not killing the process) the app and return to it (-on a phone) or I switch to a new tab and then return to the app’s tab (-on browser)

on the following image, there is a screenshot from my phone (using chrome devtools) after the splash screen (supposedly) invoked “hide()”

image
image1138×798 49.3 KB

my ‘app.component.ts’ is :

constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
    var that = this
  
    platform.ready().then(() => {
     
      platform.setDir("rtl",true)
      statusBar.styleDefault();

      firebase.auth().onAuthStateChanged((user) => {
        
        if (user) {
        that.rootPage = 'TabsPage';
        splashScreen.hide();

      } else {
        that.rootPage = 'LoginPage';
        splashScreen.hide();
          
        }
      });
    }).catch((err)=>{
      console.log(err)
    })
  }

I’ve searched all around for a solution, but never found one, I tried delaying the splash screen, reinstalling plugins etc etc, none helped .

found a solution:

2

Hi, I faced similar problem a year ago. This white screen on application start problem was related to live code update from ionic.
In my case, when I ran the application, it started to request ionic for the code update and there, it was the problem on the moment of trying unzip and apply specific package. It was a mistake in not having some necessary libraries added to the git package. E.g. you have installed momentjs library and you included it in your project. But when you make live code update with ionic, this momentjs is not included in a git repository. So, when the live code updates your code it does not have this momentks lib.

Possible problems:
1.Recently I read, that ionic updated procedure for the code update, so not it works differently.
2. Make sure you have added your libs to the git.
3. Plug your app to the computer and run it with the console enabled to check the problem

ionic cordova run android -l -c --device
ionic cordova run ios -l -c --device

The xcode console helped me to identify where exactly the problem occurred. Refer to this post Ionic Pro Deploy White Screen after Downloaded Update

P.S. Steps above helped me to solve the problem, but I decided to end up with turning this live update feature off and do the updates through official routine procedure = apple review and another version in production for android.

Hope it helps.

3

Hi Pavel, thanks for your reply !
I already solved it actually (forgot to update),

the problem, wasn’t related to any compiling flag , but to the actual code.

and if anyone who got here and has the same problem, I solved the problem by changing the rootPage logic to nav.setRoot logic