Angular 8 应用程序未在 Internet Explorer 中打开答案

【问题标题】：Angular 8 app is not opening in Internet ExplorerAngular 8 应用程序未在 Internet Explorer 中打开
【发布时间】：2019-11-06 20:59:09
【问题描述】：

我是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

在browserlist 文件中包含对IE 9-11 的支持。

但一切都是徒劳的，我无法解决这个问题。 谁能指出我做错了什么！

【问题讨论】：

清除ie浏览器缓存并重试
我已经尝试过了。即使我停止了缓存，但它没有奏效。
您是否尝试过将tsconfig.json 中的目标从es2015 更改为es5？关于 SO 处理该问题有几个答案，例如：stackoverflow.com/questions/56563742/… 或
在尝试 1 中，您是否尝试将 content="IE=edge" 更改为 content="IE=11"？
@Arikael 我在某处读到，如果您在 angular 8 工作，这不是一个好的解决方案。

标签： javascript angular typescript internet-explorer-11 angular8

【解决方案1】：

默认情况下，在 Angular 版本 8 中，启用了 ng build 的差异加载。但是对于ng test 和ng serve，它只会生成一个无法在 IE11 中运行的 ES2015 构建。

在服务期间有两种方法可以让 ES5 代码在 IE11 中运行 Angular 8 应用程序。

完全禁用差分加载。（不推荐）

您可以通过在 tsconfig.json 中将目标从 "es2015" 更改为 "es5" 来关闭差异加载。 p>

有多种服务配置。

在 tsconfig.app.json 旁边创建一个新的 tsconfig tsconfig-es5.app.json，内容如下：

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

在您的 angular.json 中，在 build 和 serve 目标下添加两个新的配置部分（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"
}
}
},

另外，browserslist文件内容如下：

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

然后您可以使用以下命令使用此配置运行服务：

ng serve --configuration es5

【讨论】：