App stucks at splash screen when running with '--prod' build

I’ve been working on an app which consists of “in-app purchases”, “firebase dynamic links”, etc.
The app works fine in both android and ios, when I used to run the app using commands:

ionic cordova run android --livereload
ionic cordova build ios

But as soon as I run the app using ‘–prod’ in front of them the app used to get stuck on my splash screen/app.component.ts screen.

Some of my app’s structure looks like this:

config.xml

<?xml version='1.0' encoding='utf-8'?>
<widget id="io.ionic.wordforyou" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>WordForYou</name>
    <description>An awesome Ionic/Cordova app.</description>
    <author email="hi@ionicframework" href="http://ionicframework.com/">Ionic Framework Team</author>
    <content src="index.html" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <preference name="ScrollEnabled" value="false" />
    <preference name="android-minSdkVersion" value="16" />
    <preference name="BackupWebStorage" value="none" />
    <preference name="SplashMaintainAspectRatio" value="true" />
    <preference name="FadeSplashScreenDuration" value="300" />
    <preference name="SplashShowOnlyFirstTime" value="false" />
    <preference name="SplashScreen" value="screen" />
    <preference name="loadUrlTimeoutValue" value="70000" />
    <preference name="webviewbounce" value="false" />
    <preference name="UIWebViewBounce" value="false" />
    <preference name="DisallowOverscroll" value="true" />
    <preference name="SplashScreenDelay" value="3000" />
    <platform name="android">
        <preference name="GoogleAndroidClientId" value="some_id_here" />
        <resource-file src="google-services.json" target="google-services.json" />
        <allow-intent href="market:*" />
        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
    </platform>
    <platform name="ios">
        <preference name="GoogleIOSClientId" value="some_id_here" />
        <resource-file src="GoogleService-Info.plist" />
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
        <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
        <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
        <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
        <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
        <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
    </platform>
    <allow-navigation href="http://192.168.0.181:8100" />
    <allow-navigation href="http://192.168.1.133:8100" />
    <allow-navigation href="http://192.168.0.180:8100" />
    <engine name="ios" spec="~4.5.4" />
    <engine name="android" spec="~6.3.0" />
    <plugin name="cordova-sqlite-storage" spec="^2.2.1" />
    <plugin name="ionic-plugin-keyboard" spec="^2.2.1" />
    <plugin name="cordova-plugin-whitelist" spec="^1.3.1" />
    <plugin name="cordova-plugin-device" spec="^1.1.4" />
    <plugin name="cordova-plugin-splashscreen" spec="^4.0.3" />
    <plugin name="cordova-plugin-ionic-webview" spec="^1.1.16" />
    <plugin name="cc.fovea.cordova.purchase" spec="^7.1.2">
        <variable name="BILLING_KEY" value="some_key_here" />
    </plugin>
    <plugin name="cordova-support-google-services" spec="^1.0.0" />
    <plugin name="cordova-plugin-firebase-dynamiclinks" spec="^0.12.1">
        <variable name="APP_DOMAIN" value="waa24.app.goo.gl" />
        <variable name="APP_PATH" value="/" />
        <variable name="FIREBASE_VERSION" value="11.0.+" />
    </plugin>
    <plugin name="cordova-plugin-x-socialsharing" spec="^5.3.2" />
</widget>

app.component.ts

@Component({
  templateUrl: 'app.html',
  providers: [
    InAppPurchase2,
    HomeService,
    AuthService,
  ]
})
export class MyApp {
  @ViewChild(Nav) nav: Nav;

  rootPage: any;
  showStartupScreen: Boolean = true;
  public tempRootPage: any;
  public hasFirebaseDynamicLink: Boolean = false;

  constructor(
    private platform: Platform,
    statusBar: StatusBar,
    splashScreen: SplashScreen,
    private store: InAppPurchase2,
    // private deeplinks: Deeplinks,
    private authService: AuthService,
    private homeService: HomeService,
    private singletonService: SingletonService,
    private storage: Storage,
    private events: Events,
    private toast: Toast,
    private firebaseDynamicLinks: FirebaseDynamicLinks,
  ) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      statusBar.styleDefault();
      splashScreen.hide();
      this._initIap();
      // this._initDeeplinks();
      this._handleEvents();
      this._initServerCalls();
    });
  }
...

In ios I’m getting the logs:

2018-03-11 09:41:33.332179+0530 WordForYou[1159:183502] DiskCookieStorage changing policy from 2 to 0, cookie file: file:///private/var/mobile/Containers/Data/Application/C577545E-13A7-4C2F-86D7-F3D3D2A74A2E/Library/Cookies/Cookies.binarycookies
2018-03-11 09:41:33.428318+0530 WordForYou[1159:183502] Apache Cordova native platform version 4.5.3 is starting.
2018-03-11 09:41:33.430405+0530 WordForYou[1159:183502] Multi-tasking -> Device: YES, App: YES
2018-03-11 09:41:33.473991+0530 WordForYou[1159:183502] CDVWKWebViewEngine: trying to inject XHR polyfill
2018-03-11 09:41:33.847546+0530 WordForYou[1159:183502] CDVWKWebViewEngine will reload WKWebView if required on resume
2018-03-11 09:41:33.847717+0530 WordForYou[1159:183502] Using Ionic WKWebView
2018-03-11 09:41:33.849899+0530 WordForYou[1159:183502] [CDVTimer][console] 0.231028ms
2018-03-11 09:41:33.850581+0530 WordForYou[1159:183502] [CDVTimer][handleopenurl] 0.357032ms
2018-03-11 09:41:33.856422+0530 WordForYou[1159:183502] [CDVTimer][intentandnavigationfilter] 5.723953ms
2018-03-11 09:41:33.856731+0530 WordForYou[1159:183502] [CDVTimer][gesturehandler] 0.190973ms
2018-03-11 09:41:33.871924+0530 WordForYou[1159:183502] [MC] System group container for systemgroup.com.apple.configurationprofiles path is /private/var/containers/Shared/SystemGroup/systemgroup.com.apple.configurationprofiles
2018-03-11 09:41:33.872972+0530 WordForYou[1159:183502] [MC] Reading from public effective user settings.
2018-03-11 09:41:33.877654+0530 WordForYou[1159:183502] InAppPurchase[objc] Initialized.
2018-03-11 09:41:33.877766+0530 WordForYou[1159:183502] [CDVTimer][inapppurchase] 20.957947ms
2018-03-11 09:41:33.901254+0530 WordForYou[1159:183502] [CDVTimer][splashscreen] 23.403049ms
2018-03-11 09:41:33.903321+0530 WordForYou[1159:183502] [CDVTimer][keyboard] 1.774073ms
2018-03-11 09:41:33.903649+0530 WordForYou[1159:183502] Starting Firebase DynamicLinks plugin
2018-03-11 09:41:33.903767+0530 WordForYou[1159:183502] [CDVTimer][firebasedynamiclinks] 0.256062ms
2018-03-11 09:41:33.904093+0530 WordForYou[1159:183502] [CDVTimer][socialsharing] 0.259042ms
2018-03-11 09:41:33.904176+0530 WordForYou[1159:183502] [CDVTimer][TotalPluginStartup] 55.562019ms
2018-03-11 09:41:33.911672+0530 WordForYou[1159:183545] [MC] Filtering mail sheet accounts for bundle ID: io.ionic.wordforyou, source account management: 1
2018-03-11 09:41:33.922380+0530 WordForYou[1159:183545] [MC] Result: YES
2018-03-11 09:41:33.922951+0530 WordForYou[1159:183545] [MC] Filtering mail sheet accounts for bundle ID: io.ionic.wordforyou, source account management: 1
2018-03-11 09:41:33.924259+0530 WordForYou[1159:183545] [MC] Result: YES
2018-03-11 09:41:34.335772+0530 WordForYou[1159:183502] InAppPurchase[objc] (before init): WARNING: Your app should be single page to use in-app-purchases. onReset is not supported.

My ionic info prints this:

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.19.0
    ionic (Ionic CLI) : 3.19.0

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.1.5
    Cordova Platforms  : android 6.3.0 ios 4.5.4
    Ionic Framework    : ionic-angular 3.9.2

System:

    ios-deploy : 1.9.2
    Node       : v6.11.3
    npm        : 3.10.10
    OS         : macOS High Sierra
    Xcode      : Xcode 9.2 Build version 9C40b

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : pro

My chrome inspector showing me this log (in dev mode only, by the way my app is working with this log - this is only for your information)
49%20AM

I’ve been trying to solve this issue for past 2 days, but I’m unable to figure out this issue.
Can you please help me out with this?

See this question on stackoverflow - https://stackoverflow.com/questions/49217131/ionic-app-halts-at-splash-screen-when-running-with-prod-build

1 Like

It is useful to check the console for JavaScript errors in situations like this. Use remote debugging in Safari, and make sure to refresh the application whilst the debugger is attached so that you don’t miss startup errors: https://www.youtube.com/watch?v=9J8AxhDxtTE

Random observation, don’t use Boolean as a Type. Use boolean

I got this in my safari debugger. Maybe this would help you out…!
10%20PM

Just for the sake of knowledge, can you tell me the difference between Boolean and boolean ?

Short version is that Boolean is an object instance. A good quote that kindof puts it in a nutshell

“And since the Boolean object is an object, it will also coerce to true, even if its internal value is false.”

My take on it is, it can lead to serious misinterpretations and errors.

I’m not versed enough in the internal process of Ionic / webpack etc. to know if that is remedied at some point, but it’s safe to say it’s an issue that can and should be avoided absent that knowledge.

But the fact that it’s an object instance, and will always resonate as true makes sense by its existing in the first place.

Did you find any solution? I am facing the same issue with ios versions < 11.0