Ionic 2: Fix splash screen white screen issue

Fix issue where you see a blank screen after your splash screen disappears.

1) Install the plugin and the Ionic-Native wrapper:

$ ionic plugin add cordova-plugin-splashscreen
$ npm install --save @ionic-native/splash-screen

2) Amend 'config.xml':

  <preference name="SplashMaintainAspectRatio" value="true"/>
  <preference name="SplashScreen" value="screen"/>
  <preference name="SplashScreenDelay" value="30000"/>
  <preference name="AutoHideSplashScreen" value="false"/>
  <preference name="SplashShowOnlyFirstTime" value="false"/>
  <preference name="FadeSplashScreen" value="false"/>

3) Import SplashScreen in your 'app.module.ts' providers section:

import { SplashScreen } from '@ionic-native/splash-screen';

  declarations: [...]
  imports: [IonicModule.forRoot(MyApp)],
  bootstrap: [IonicApp],
  entryComponents: [...],
  providers: [SplashScreen, ...]
export class AppModule {}

4) In your 'app.component.ts':

import { SplashScreen } from '@ionic-native/splash-screen';

  templateUrl: 'app.html'
export class MyApp {
    public _app: App,
    public _platform: Platform,
    public _SplashScreen: SplashScreen) {

5) Then in 'initializeApp()':

  initializeApp() {
    this._platform.ready().then(() => {
      // do whatever you need to do here.
      setTimeout(() => {
      }, 100);


This will make the splash screen hiding entirely dependent on the platform being ready firing, then the timeout is a little extra safeguard against the flashing. Leave the 'config.xml' setting to a ridiculously high number, don't touch it.

Hope this helps, Cheers.