IONIC 2 Sample App not working on Internet Explore

HI,

I created a sample ionic 2 App which works perfectly on Chrome and Android Browser, but when I tried it on Internet Explorer It giving me below error.

EXCEPTION: Error: Uncaught (in promise): SyntaxError
EXCEPTION: Error: Uncaught (in promise): SyntaxError
STACKTRACE:
Error: Uncaught (in promise): SyntaxError
at resolvePromise (http://localhost/build/js/angular2-polyfills.js:602:26)
at Anonymous function (http://localhost/build/js/angular2-polyfills.js:638:18)
at ZoneDelegate.prototype.invokeTask (http://localhost/build/js/angular2-polyfills.js:421:18)
at onInvokeTask (http://localhost/build/js/app.bundle.js:27982:25)
at ZoneDelegate.prototype.invokeTask (http://localhost/build/js/angular2-polyfills.js:421:18)
at Zone.prototype.runTask (http://localhost/build/js/angular2-polyfills.js:320:22)
at drainMicroTaskQueue (http://localhost/build/js/angular2-polyfills.js:541:26)
at invoke (http://localhost/build/js/angular2-polyfills.js:493:22)

While Angular 2 sample project is working fine on Internet Explore why there is a difference in IONIC 2 build , UI issue is fine but at least it should run the App without breaking.

Thanks ,
Snehasis Mohapatra

1 Like

Hi there!
So Ionic 2 does not support IE.
We do support Edge though.

1 Like

Ok, So it will not work on any windows Phone as they don’t have edge yet ?

Also what is the reason its failing on the Promise as normal Angular 2 project works perfectly there ?
http://plnkr.co/edit/?p=preview

Please let me know.

Thanks

1 Like

Angular 2 no longer includes the necessary shims for IE, include this script:

https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js

Specifically its the shim for Object.name that helps this particular issue (during template compilation):

// function.name (all IE)
/*! @source http://stackoverflow.com/questions/6903762/function-name-not-supported-in-ie*/
if (!Object.hasOwnProperty('name')) {
  Object.defineProperty(Function.prototype, 'name', {
    get: function() {
      var matches = this.toString().match(/^\s*function\s*(\S*)\s*\(/);
      var name = matches && matches.length > 1 ? matches[1] : "";
      // For better performance only parse once, and then cache the
      // result through a new accessor for repeated access.
      Object.defineProperty(this, 'name', {value: name});
      return name;
    }
  });
}
2 Likes

As a follow up, the official Angular 2 way is to add core-js (from npm) then include
/node_modules/core-js/client/shim.min.js instead of other older IE shims (see https://angular.io/docs/ts/latest/quickstart.html)

By default your Ionic app will not support loading from node_modules so you can workaround by create a lib folder in your app www, then just copy shim.min.js into there and include /lib/shim.min.js. The proper method would be to adjust the build scripts.

1 Like

Hey … Can you please share the link to download shim.min.js file .
Thanks