I am using anugular-cli 1.0.0-beta.16 which has polyfills.ts which looks like this:

// This file includes polyfills needed by Angular 2 and is loaded before
// the app. You can add your own extra polyfills to this file.
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/set';
import 'core-js/es6/reflect';

import 'core-js/es7/reflect';
import 'zone.js/dist/zone';

But this pollyfills file is not working on IE11 and it works on Chrome, Firefox, EDGE and my main.ts looks like this:

import "./polyfills.ts";
import {platformBrowserDynamic} from "@angular/platform-browser-dynamic";
import {enableProdMode} from "@angular/core";
import {environment} from "./environments/environment";
import {AppModule} from "./app/";

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

Running this on IE11 produces shows error on fat arrow expression error

SCRIPT1002: Syntax error

For minifiedjs at this position:

function arrayUnion(arr1, arr2) {
    return arr1
        .concat(arr2.filter(v => arr1.indexOf(v) === -1));
}

and this is how my tsconfig.json looks like

    {
  "pilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es6", "dom"],
    "mapRoot": "./",
    "module": "es6",
    "moduleResolution": "node",
    "outDir": "../dist/out-tsc",
    "sourceMap": true,
    "target": "es5",
    "typeRoots": [
      "../node_modules/@types"
    ]
  }
}

@Cleton this is how my tsconfig looks like

I am using anugular-cli 1.0.0-beta.16 which has polyfills.ts which looks like this:

// This file includes polyfills needed by Angular 2 and is loaded before
// the app. You can add your own extra polyfills to this file.
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/set';
import 'core-js/es6/reflect';

import 'core-js/es7/reflect';
import 'zone.js/dist/zone';

But this pollyfills file is not working on IE11 and it works on Chrome, Firefox, EDGE and my main.ts looks like this:

import "./polyfills.ts";
import {platformBrowserDynamic} from "@angular/platform-browser-dynamic";
import {enableProdMode} from "@angular/core";
import {environment} from "./environments/environment";
import {AppModule} from "./app/";

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

Running this on IE11 produces shows error on fat arrow expression error

SCRIPT1002: Syntax error

For minifiedjs at this position:

function arrayUnion(arr1, arr2) {
    return arr1
        .concat(arr2.filter(v => arr1.indexOf(v) === -1));
}

and this is how my tsconfig.json looks like

    {
  "pilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es6", "dom"],
    "mapRoot": "./",
    "module": "es6",
    "moduleResolution": "node",
    "outDir": "../dist/out-tsc",
    "sourceMap": true,
    "target": "es5",
    "typeRoots": [
      "../node_modules/@types"
    ]
  }
}

@Cleton this is how my tsconfig looks like

• javascript
• angular
• typescript
• angular-cli
• es5-shim

• Could you show your tsconfig file? – Cleiton Commented Dec 1, 2016 at 14:19
• { "pilerOptions": { "declaration": false, "emitDecoratorMetadata": true, "experimentalDecorators": true, "lib": ["es6", "dom"], "mapRoot": "./", "module": "es6", "moduleResolution": "node", "outDir": "../dist/out-tsc", "sourceMap": true, "target": "es5", "typeRoots": [ "../node_modules/@types" ] } } @Cleiton this is how my tsconfig file looks like – ruksad Commented Dec 1, 2016 at 16:34
• You tsconfig looks ok, but it is on root of your project? – Cleiton Commented Dec 1, 2016 at 20:11
• Cleiton thanks for taking efforts , this is an angular-cli project and it puts tsconfig.json in src folder where files like 1.index.html 2.main.ts 3.polyfills.ts 4.typings.d.ts resides – ruksad Commented Dec 2, 2016 at 4:23

1 Answer 1

You are probably targeting es6, which piles the arrow functions to arrow functions:

let fn = () => console.log("hey");

Compiles to:

let fn = () => console.log("hey");

But if you target es5 it piles to:

var fn = function () { return console.log("hey"); };

It seems that IE11 (or any other version of explorer) do not yet support arrow functions.
If you want to support it you'll have to target es5 or below, as there is no pollyfil for arrow functions.