White screen for iOS only


#1

My app runs on Android without problems, but for iOS the app just shows a white screen.

My app has a side menu, the menu actually works and can be displayed on iOS, I can drag from the left edge to open the menu, but the main content is white screen no matter which page I switched to. Other ui elements like Alert dialog, toast can show correctly.
The non-ui logic runs correctly for that page, just ui is not displaying.

I use safari to see if there is any error, and don’t know if this error caused the blank ui:
[Error] Failed to load resource: The requested URL was not found on this server. (es6-shim.map, line 0)

my ionic info:

 Cordova CLI: 6.1.1
 Ionic Framework Version: 2.0.0-beta.6
 Ionic CLI Version: 2.0.0-beta.25
 Ionic App Lib Version: 2.0.0-beta.15
 ios-deploy version: 1.8.2 
 ios-sim version: 5.0.1 
 OS: Mac OS X El Capitan
 Node Version: v4.2.2
 Xcode version: Xcode 7.2 Build version 7C68 

package.json dependencies:

  "dependencies": {
     "angular2": "2.0.0-beta.15",
     "chance": "^1.0.2",
     "es6-promise": "3.1.2",
     "es6-shim": "^0.35.0",
     "ionic-angular": "2.0.0-beta.6",
     "ionic-native": "^1.1.1",
     "ionicons": "3.0.0",
     "moment": "^2.13.0",
     "ng2-translate": "^1.11.0",
     "parse": "^1.8.3",
     "reflect-metadata": "0.1.2",
     "rxjs": "5.0.0-beta.2",
     "zone.js": "0.6.12"
  }

any ideas what caused the ui not loading?


Ionic 2 error not showing in nav.push(somePage);
#2

About this error (that es6-shim.map can’t be found), it seems to appear only in Safari:

tlancina: Just to reassure everyone, this doesn’t break anything, it’s just Safari failing to find the sourcemap for es-shim.js, not sure why it only happens on Safari.

I guess that the white screen might be caused by another error because there was another forum topic recently mentioning that the browser goes blank without any errors on Mac OS X El Capitan:

@colaboy2004 Could you try to make an error in your code on purpose (i.e. like one of the errors mentioned in the following comment - missing import or DI parameter) and check if it will be shown in the browser console?


#3

After debugging for a few days, I discovered the issue.
It’s caused by ‘use strict’ in the js files under the build/js folder.
I added a gulp task to remove ‘use strict’, and the app works correctly now.
I guess this is the old iOS WebKit issue? I am testing on iOS 9.3 on my iPod touch.


#4

It might be platform-specific (related to Mac OS X or WebKit), I opened a new issue about it: