[筆記][茶包][Angular][IE]解決 Angular 2 在 IE中遇到「物件沒有支援這個屬性或方法 'assign' (Object doesn't support property or method 'assign')」問題

在開發 angular 2 (angular 4)過程中,小喵通常會用 Chrome 來開發,但運行很正常的專案,在 IE 中卻遇到『物件沒有支援這個屬性或方法 'assign' (Object doesn't support property or method 'assign')』的問題。要怎麼處理這樣的茶包,請繼續看下去~

緣起

在開發 angular 2 (angular 4)過程中,小喵通常會用 Chrome 來開發,但運行很正常的專案,偏偏在 IE 中卻遇到『物件沒有支援這個屬性或方法 'assign' (Object doesn't support property or method 'assign')』的問題。IE的相容性問題,真是讓人又愛又恨~如何解決這個問題,我們就看下去

 

polyfills.ts

從官網的這一篇『Browser support』裡面,提到了PolyFill。為了讓一些較舊版本的瀏覽器可以支援新的功能, Angular-CLI 產的的專案中,在App資料夾中,有個『polyfills.ts』這個資料夾,這裡面預設就準備好一些相容性的設定在裡面。如果有一些額外的polyfill設定,也可以自己將之加入其中。

裡面,就有如何讓 IE 9, 10, 11支援的一些 polyfills,預設是註解起來的。我們將這些註解拿掉~

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
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/weak-map';
import 'core-js/es6/set';

就醬子,重新執行,原本 IE 中無法運作的頁面,就這樣活起來了~
^_^

 

以上小喵筆記下來,提供大家參考

 

參考資料:

 


以下是簽名:


Microsoft MVP
Visual Studio and Development Technologies
(2005~2019/6)