CODEWITHSUNDEEP
javascriptangulartypescriptinternet-explorer-11polyfills
Davide De Santis
Davide De Santis

Reputation: 1035

Object.assign() in IE11 with Angular2

I know that this issue has been discussed a billion times, but it seems that none of the solutions I can find here are helping in my case.

This is what my polyfills.browser.ts looks like right now:

import 'ie-shim';
import 'core-js/es7/reflect';

import 'reflect-metadata';
import 'zone.js/dist/zone';

As stated before, I tried different approaches for solving this.

I tried adding all imports that are uncommented by default: 

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';

I tried using 

import "core-js/client/shim";

and also 

import 'mdn-polyfills/Object.assign';

and 

import 'core-js';

All of these were added to the top of polyfills.browser.ts

None seems to help and I keep getting Object doesn't support property or method 'assign' in IE11.

Upvotes: 3

Views: 3247

Answers (2)

Daniel Kucal
Daniel Kucal

Reputation: 9232

I had the same issue even using polyfill on IE11, but not every time. The problem was that sometimes main script was being loaded before polyfills, so I've made the following change in webpack config:

       new CommonsChunkPlugin({
-        name: 'polyfills',
-        chunks: ['polyfills']
+        name: ['polyfills', 'main'].reverse(),
       })

So now with just:

new CommonsChunkPlugin({
  name: ['polyfills', 'main'].reverse(),
})

it seems to work properly

Upvotes: 0

Estus Flask
Estus Flask

Reputation: 222369

Object.assign is ES2015 and is covered by a polyfill:

import 'core-js/es6/object';

Or for a broader range of ES2015 polyfills:

import 'core-js/es6';

The reason why it is preferable to list ES2015 polyfills in Angular application instead of importing core-js/es6 is that core-js/es6/promise polyfill is already covered by Zone.js and may cause problems,.

If this doesn't work and

Object doesn't support property or method 'assign'

error occurs, this means that polyfills bundle wasn't loaded in browser, or a piece of code where Object.assign occurs was evaluated before polyfills bundle was loaded.

Upvotes: 3

Related Questions