Приложение Angular 8 не открывается в Internet Explorer

Question

Я новичок в Angular 8 и в настоящее время развиваю web-app в нем. Он отлично работает в Google Chrome и EDGE, но даже не загружается в IE 11. Я искал решение по Интернету и попробовал несколько предложенных решений.

Я пытался:

---

Попытка 01:

Вставить эти строки кода в index.html

<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
<script src="https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js"></script>

Попытка 02

Добавлены эти строки в polyfills.ts

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
 import 'core-js/es/symbol';
 import 'core-js/es/object';
 import 'core-js/es/function';
 import 'core-js/es/parse-int';
 import 'core-js/es/parse-float';
 import 'core-js/es/number';
 import 'core-js/es/math';
 import 'core-js/es/string';
 import 'core-js/es/date';
 import 'core-js/es/array';
 import 'core-js/es/regexp';
 import 'core-js/es/map';
 import 'core-js/es/set';

Попытка 03

Включена поддержкаIE 9-11 в browserlist файле.

---

Но все напрасно, и я не смог решить эту проблему. Может кто-нибудь определить, что я делаю не так!

Answer 1

По умолчанию в угловой версии 8 включена дифференциальная нагрузка для ng build. Однако для ng test и ng serve он генерирует только одну сборку ES2015, которая не может работать в IE11.

Существует два способа иметь код ES5 во время подачи, который заставляет приложение angular 8 работать в IE11.

1. Полностью отключить дифференциальную нагрузку. ( Не рекомендуется )

   Вы можете отключить дифференциальную нагрузку, изменив цель с "es2015" на "es5" в своем tsconfig.json .

2. Имеется несколько конфигураций для подачи.

   Создайте новый tsconfig tsconfig-es5.app.json рядом с tsconfig.app.jsonсо следующим содержимым:

   { 
    "extends": "./tsconfig.app.json",
    "compilerOptions": { 
    "target": "es5"   
     }
   }
   

   В вашем angular.json добавьте два новых раздела конфигурации (узел es5) под сборку и укажите цель для предоставления нового tsconfig.

   "build": {
       "builder": "@angular-devkit/build-angular:browser",
       "options": {
           ...
   },
   "configurations": {
   "production": {
       ...
   },
   "es5": {
       "tsConfig": "./tsconfig-es5.app.json"
   }
   }
   },
   "serve": {
   "builder": "@angular-devkit/build-angular:dev-server",
   "options": {
       ...
   },
   "configurations": {
   "production": {
   ...
   },
   "es5": {
       "browserTarget": "<your application name>:build:es5"
   }
   }
   },
   

   Кроме тогосодержимое файла списка браузеров, как показано ниже:

   > 0.5%
   last 2 versions
   Firefox ESR
   not dead
   IE 9-11 # For IE 9-11 support, remove 'not'.
   

   Затем вы можете запустить подачу с этой конфигурацией, используя следующую команду:

   ng serve --configuration es5