Ionic cordova run android produces white screen of death

Ionic Framework ionic-v3
1

When I run ionic cordova run android the app loads on my device, and when the splash screen fades away I get a blank white screen. Upon inspecting it with Chrome dev tools, I see the following errors:

cordova.js Failed to load resource: net::ERR_FILE_NOT_FOUND
16:32:44.195 main.css Failed to load resource: net::ERR_FILE_NOT_FOUND
16:32:44.195 vendor.js Failed to load resource: net::ERR_FILE_NOT_FOUND
16:32:44.195 polyfills.js Failed to load resource: net::ERR_FILE_NOT_FOUND
16:32:44.196 main.js Failed to load resource: net::ERR_FILE_NOT_FOUND
16:32:44.238 /assets/icon/favicon.ico Failed to load resource: net::ERR_FILE_NOT_FOUND

I’ve actually already deployed this app to the play store, so I know it was working, but I am not sure why it isn’t now. I haven’t edited index.html to change the paths. I also tried ionic cordova platform rm android and ionic cordova platform add android but I am still getting those errors.

It works fine when I run ionic serve or when I run ionic cordova run android -lcs

Here is my ionic info:

cli packages: (/Applications/MAMP/htdocs/sparkles-android/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.4
    Cordova Platforms  : android 6.3.0 browser 5.0.1
    Ionic Framework    : ionic-angular 3.9.2

System:

    Node  : v6.12.2
    npm   : 5.2.0
    OS    : macOS Sierra
    Xcode : Xcode 8.3.2 Build version 8E2002

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : pro
2

does anyone have any ideas on how to fix this?

3

what’s the version of your android in device ?

4

It’s a samsung galaxy s8+ with android 7.0. Is that what you were looking for?

5

what folder should cordova.js and the other js files live in once I run ionic cordova run android?

6

cordova.js lives in \platforms\android\platform_www.

7

cordova.js is there, so I don’t understand why it’s not found when I use Chrome dev tools to inspect it

8

I’ve ran ionic cordova platform rm android and ionic cordova platform add android with no issues.

Then I run ionic serve and it works.
ionic cordova run android -lcs works.

ionic cordova run android gives me the white screen… I don’t understand

2 Likes
9

Does anyone have any suggestions? I am at a loss here

10

Create a new project with ionic startand try there. Does it work?

1 Like
11

Yes, that works, but I need to know what would cause an app to not be able to find cordova.js

This is my src/index.html file;

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
  
  <meta charset="UTF-8">
  <title>Ionic App</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta name="format-detection" content="telephone=no">
  <meta name="msapplication-tap-highlight" content="no">

  <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
  <link rel="manifest" href="manifest.json">
  <meta name="theme-color" content="#4e8ef7">

  <base href="/">
 
  <!-- cordova.js required for cordova apps -->
  <script src="cordova.js"></script>
  <!-- error monitoring -->
  <!-- <script src="https://code.ionicframework.com/services/ionic-error-tracking.min.js" data-app-id="a9dbb7e5" data-app-version="0.0.1"></script> -->

  <!-- un-comment this code to enable service worker
  <script>
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('service-worker.js')
        .then(() => console.log('service worker installed'))
        .catch(err => console.error('Error', err));
    }
  </script>-->

  <link href="build/main.css" rel="stylesheet">

</head>
<body>

  <!-- Ionic's root component and where the app will load -->
  <ion-app></ion-app>

  <!-- The polyfills js is generated during the build process -->
  <script src="build/polyfills.js"></script>

  <!-- I upgraded ionic and ended up with a breaking change. Adding this line fixed it -->
  <!-- reference: https://stackoverflow.com/questions/44988166/ionic-2-referenceerror-webpackjsonp-is-not-defined -->
  <script src="build/vendor.js"></script>

  <!-- The bundle js is generated during the build process -->
  <script src="build/main.js"></script>

</body>
</html>
12

I had this same problem and it haunted me for days.

Just remove the <base href="/"> tag from the index.html file, and make sure none of the src references have a leading /.

1 Like
13

OMG that fixed it! Thank you so much! I have been working on this for weeks

2 Likes
14

Ok, so I did that and it works fine when I run ionic cordova run android --prod and test it on my phone. However after releasing it through the play store, for some reason some phones (not all) get a white screen the second time they open it.

So they download the app, use it, and close it. Then when they reopen it, the splash screen fades away and then there is a white screen that will not go away. Any thoughts?

15

Still having this same issue. Has anyone else experienced it?

16

Still having this same issue. Has anyone else experienced it?

17

@juniethreatt did you ever figure this out? I’m running into the same issue.

It only occurs when using the --release flag. Frustrating, as that inherently disables debugging (re-enabling debugging in the manifest makes it works but then of course google play won’t allow it).

18

Update:

GOT IT!

It was a plugin error. Blew away my platform folder and my plugin folder. Started working afterward.

For future travelers: Add an alert on device.ready. If it doesn’t fire (in this case the second time the app was open) then it’s probably a plugin issue.

19

Hi there. Which plugin was creating the issue? And how did you fix it? Thanks

20

adding something here. don’t remove ,
just change the “/” to “.”, so it look like that:

and it working.

2 Likes