Problem loading the app

xxmuaddib · December 12, 2017, 1:05pm

Hi there!

I tried to build my app on different angular/ionic versions and came to the same problem.

When I run ionic cordova run android, the app starts almost always. Then I close the app and open it from my phone. Splashscreen with the spinner comes up and never loads.

However my config.xml is contains as follows:
<preference name="SplashScreen" value="screen" />
<preference name="SplashMaintainAspectRatio" value="tru" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="ShowSplashScreenSpinner" value="false" /> (During normal start the spinner doesn’t come up, but the second time it comes up)
<preference name="AutoHideSplashScreen" value="true" />
<preference name="SplashScreenDelay" value="3000" />

Just in case I also tried to use splashscreen hiding from code:
constructor(public _SplashScreen: SplashScreen)
{
initializeApp();
}
initializeApp() {
this.platform.ready().then(() => {
this._SplashScreen.hide();
}
}

But the same problem.

One more thing. Sometimes when I start the app some message comes up on my phone but disappears fast and I cant read it. Something about Debug Deploy and containing buttons Ignore and Update.

Can you hint where should I search for problem?

There are no errors, no warnings, nothing. Over than this problem the app works perfectly.

Thank you very much in advance.

SigmundFroyd · December 12, 2017, 2:05pm

So inspecting it with chrome developer tools doesn’t reveal anything?

xxmuaddib · December 12, 2017, 3:14pm

The strange thing is that in Inspect I can see the app started. But on my phone (Galaxy Note 8 and also Google Nexus 6p) there’s the screen I have posted (Splash Screen and Spinner)

SigmundFroyd · December 12, 2017, 3:17pm

Interesting.

Two things.

First, what does ionic info output?

Actually, three things.

Second, what does your package.json look like?

Third, have you tried removing the splash screen plugin? This isn’t a valid solution, naturally. I’d just because what it’d do in that case.

xxmuaddib · December 12, 2017, 3:20pm

Ionic Info:

cli packages: (C:\Users\User\AppData\Roaming\npm\node_modules)

@ionic/cli-utils  : 1.17.0
ionic (Ionic CLI) : 3.17.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.1
Ionic Framework    : ionic-angular 3.9.2

System:

Android SDK Tools : 25.3.1
Node              : v7.5.0
npm               : 4.1.2
OS                : Windows 10

Environment Variables:

ANDROID_HOME : C:\Users\User\AppData\Local\Android\sdk

Misc:

backend : pro

Package.json:

{
“name”: “HayPost”,
“author”: “Mikayel Saghyan”,
“homepage”: “http://www.haypost.am”,
“private”: true,
“scripts”: {
“build”: “ionic-app-scripts build”,
“clean”: “ionic-app-scripts clean”,
“lint”: “ionic-app-scripts serve”,
“serve”: “ionic-app-scripts lint”,
“ionic:build”: “npm run build”,
“ionic:serve”: “npm run serve”,
“ionic:lint”: “npm run lint”
},
“dependencies”: {
“@angular/common”: “5.0.0”,
“@angular/compiler”: “5.0.0”,
“@angular/compiler-cli”: “5.0.0”,
“@angular/core”: “5.0.0”,
“@angular/forms”: “5.0.0”,
“@angular/http”: “5.0.0”,
“@angular/platform-browser”: “5.0.0”,
“@angular/platform-browser-dynamic”: “5.0.0”,
“@ionic-native/core”: “4.3.1”,
“@ionic-native/device”: “^4.5.2”,
“@ionic-native/geolocation”: “^4.5.2”,
“@ionic-native/in-app-browser”: “4.3.1”,
“@ionic-native/native-storage”: “^4.5.2”,
“@ionic-native/push”: “^4.5.2”,
“@ionic-native/splash-screen”: “4.3.1”,
“@ionic-native/status-bar”: “4.3.1”,
“@ionic/storage”: “^2.1.3”,
“cordova-android”: “~6.3.0”,
“cordova-ios”: “^4.5.2”,
“cordova-plugin-console”: “^1.0.7”,
“cordova-plugin-crosswalk-webview”: “^2.3.0”,
“cordova-plugin-device”: “^1.1.6”,
“cordova-plugin-geolocation”: “^2.4.3”,
“cordova-plugin-inappbrowser”: “^1.7.1”,
“cordova-plugin-ionic”: “^2.0.1”,
“cordova-plugin-ionic-keyboard”: “^2.0.2”,
“cordova-plugin-ionic-webview”: “^1.1.15”,
“cordova-plugin-ionic-wkkeyboard”: “^1.1.15”,
“cordova-plugin-nativestorage”: “^2.2.2”,
“cordova-plugin-recentscontrol”: “^1.1.0”,
“cordova-plugin-splashscreen”: “^4.0.3”,
“cordova-plugin-statusbar”: “git+https://github.com/apache/cordova-plugin-statusbar.git”,
“cordova-plugin-whitelist”: “^1.3.2”,
“firebase”: “^3.5.3”,
“ionic-angular”: “3.9.2”,
“ionicons”: “3.0.0”,
“ng2-translate”: “^3.1.3”,
“phonegap-plugin-push”: “^2.1.0”,
“rxjs”: “5.5.2”,
“zone.js”: “0.8.18”
},
“devDependencies”: {
“@ionic/app-scripts”: “3.1.5”,
“typescript”: “~2.4.2”
},
“config”: {
“ionic_aot_write_to_disk”: true
},
“cordova”: {
“platforms”: [
“ios”,
“android”
],
“plugins”: {
“cordova-plugin-crosswalk-webview”: {
“XWALK_VERSION”: “22+”,
“XWALK_LITEVERSION”: “xwalk_core_library_canary:17+”,
“XWALK_COMMANDLINE”: “–disable-pull-to-refresh-effect”,
“XWALK_MODE”: “embedded”,
“XWALK_MULTIPLEAPK”: “true”
},
“cordova-plugin-device”: {},
“cordova-plugin-inappbrowser”: {},
“cordova-plugin-whitelist”: {},
“cordova-plugin-ionic-webview”: {},
“cordova-plugin-ionic-wkkeyboard”: {},
“cordova-plugin-statusbar”: {},
“cordova-plugin-console”: {},
“cordova-plugin-splashscreen”: {},
“cordova-plugin-recentscontrol”: {},
“phonegap-plugin-push”: {
“FCM_VERSION”: “11.0.1”
},
“cordova-plugin-geolocation”: {},
“cordova-plugin-nativestorage”: {},
“cordova-plugin-ionic”: {
“APP_ID”: “c6264b19”,
“CHANNEL_NAME”: “Master”,
“UPDATE_METHOD”: “background”,
“UPDATE_API”: “https://api.ionicjs.com”,
“MAX_STORE”: “2”
}
}
}
}

And I guess I cannot remove the plugin:
D:\IdeaProjects\PostMobile>ionic cordova plugins remove splashscreen

cordova plugin remove splashscreen --save
Error: The plugin ‘cordova-plugin-splashscreen’ is required by (cordova-plugin-ionic), skipping uninstallation. (try --force if trying to update)

[ERROR] An error occurred while running cordova plugin remove splashscreen --save (exit code 1).

SigmundFroyd · December 12, 2017, 3:27pm

Alright, so in your package.json you have:

“cordova-plugin-ionic”: {
  “APP_ID”: “c6264b19”,
  “CHANNEL_NAME”: “Master”,
  “UPDATE_METHOD”: “background”,
  “UPDATE_API”: “https://api.ionicjs.com”,
  “MAX_STORE”: “2”
}

I’m not super familar with the plugin, but according to the docs the background setting for update_method will download updates in the background and apply them the next time the app starts. Are you utilizing this plugin actively? Does your app work if you remove this section?

david_bc · December 12, 2017, 3:27pm

I noticed that using Chrome remote device when u use observable or other, can cause this strange issue…

Do this happened when you do the same scenario without to be connected to remote chrome ?

xxmuaddib · December 12, 2017, 3:31pm

When I disconnect the USB cable and launch the app the same happens. But a message blinks for a second. I managed to printscreen it.

Maybe the app waits for an action for this alert, but the alert goes to the background making it impossible to do something?

And what causes this alert come anyway?

david_bc · December 12, 2017, 3:35pm

Plug the cable, run “ionic cordova run android --prod --device” but don’t connect chrome remote dev tools

SigmundFroyd · December 12, 2017, 3:44pm

That’d probably be the deploy plugin I mentioned, the cordova-plugin-ionic.

xxmuaddib · December 12, 2017, 3:45pm

It had the same behaviour. After closing and reopening the app several times it started to work. And the message pops up and is clickable. And the app is loading with the message on top.

Maybe the version change (my app version) might help?

SigmundFroyd · December 12, 2017, 3:48pm

If you’re not using the deploy plugin I’d just remove it.

xxmuaddib · December 12, 2017, 3:54pm

Thank you! Works like charm!

Topic		Replies	Views
Android loading removes splashscreen ionic-v3	0	444	October 11, 2018
Android stuck splascreen Appflow	5	2688	February 15, 2019
Ios app stuck on splashscreen on app restart ionic-v3	1	2427	November 29, 2017
Splashscreen problem ionic-v3	4	1578	March 6, 2019
[Solved] Splash screen blank ionic-v3	80	63410	October 31, 2019

Problem loading the app

Related topics