ionic android white screen after showing the splash screen

Question

I have built an apk file using ionic cordova build android . And I have opened that app using Genymotion emulator. When I opened the app, it starts and displays the splash screen. After that a white screen appears forever (I can close the app. But when I start that again, same thing happens).

I have captured the error in the android studio console.

Here they are,

And then I have opened the main.js file in that apk. In line 40, I have found this code.

Then I browsed the scanner.ts in pages (./pages/scanner/scanner.ts) folder. I did not find anything wrong. It works when I run that using cordova run browser .

scanner.ts

Here are some more information on my setup:

npm list -g --depth=0
+-- babel@6.23.0
+-- babel-cli@6.24.1
+-- cordova@7.0.1
+-- ionic@3.5.0
-- nodemon@1.11.0

Installed platforms:
  android 4.0.0
  browser 4.1.0
Available platforms:
  blackberry10 ~3.8.0 (deprecated)
  webos ~3.7.0
  windows ~5.0.0

Thanks for reading this post. If you know what causes this. Or how to resolve this issue, Please let me know.

Answer 1

The best of clarity is to find error، error on the emulator.

Debug Ionic Android Application On Mobile Devices or Emulators.

Inspect elements and network monitor, the same way you do with websites. Use chrome dev tools, write chrome://inspect/#devices in chrome address bar and hit enter. It will open the following page in your browser, showing all devices and hybrid applications running on it.

Now clicking on inspect will open the same inspection window like web page. See the following image for visual understanding.

For more info

Answer 2

Changing the target value in the tsconfig.json from es6 to es5 has worked.
Eg. "target": "es6" >>> "target": "es5"

Note: This problem will not automatically happen to the project unless you declare that explicitly.

Answer 3

您只需要使用 Android SDK 的确切 API 版本添加一个新的虚拟设备，白屏就会消失。

Answer 4

config.xml

 <preference name="auto-hide-splash-screen" value="false" /> 
 <preference name="AutoHideSplashScreen" value="false" />

main.js please change

this.platform.ready().then(function () {
        _this.statusBar.styleDefault();
        _this.splashScreen.hide();
    });

to

this.platform.ready().then(function () {
            _this.statusBar.styleDefault();
            setTimeout(function(){
                _this.splashScreen.hide();

            }, 3000);
        });