IE11 中的 Angular 4 错误答案

【问题标题】：Angular 4 error in IE11IE11 中的 Angular 4 错误
【发布时间】：2017-09-04 11:31:38
【问题描述】：

我有在 Chrome 上成功运行的 Angular 4 项目。但是它不会在 IE11 上加载，polyfills.bundle.js 中出现以下错误（我使用命令“ng build --env=prod”来构建站点）：

var exports = module.exports = function (iterable, entries, fn, that, ITERATOR) {
  var iterFn = ITERATOR ? function () { return iterable; } : getIterFn(iterable);
  var f = ctx(fn, that, entries ? 2 : 1);
  var index = 0;
  var length, step, iterator, result;
  if (typeof iterFn != 'function') throw TypeError(iterable + ' is not iterable!');

iterFn 在此处未定义，因此会引发错误。请指教。

【问题讨论】：

也许声明您在 polyfills.ts 中添加/取消注释了 polyfill？
谢谢你，Per。这确实是问题的根本原因。

标签： angular

【解决方案1】：

为了更好地支持 IE11，您需要在您的 polyfill 中专门添加一些 es6 导入。清单如下：

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

【讨论】：

这可以通过注释掉polyfills.ts文件中所有标记为IE9、IE10和IE11 polyfills的行来完成

【解决方案2】：

@Sumit 已回答需要在 polyfill.ts 文件中添加这些导入：

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

另外你需要导入反射api：

/** IE10 and IE11 requires the following for the Reflect API. */

 import 'core-js/es6/reflect';

/** Evergreen browsers require these. **/

// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators),you 
//can remove.

import 'core-js/es7/reflect';

另外，如果您在项目中使用 Angular 材质动画，则需要导入 Web 动画以使 Angular 材质在 IE 上正常运行。

import 'web-animations-js';  // Run `npm install --save web-animations-js`.

最后但并非最不重要的一个非常重要的库，可以在 IE 上正常运行您的 Angular 项目：

/** IE10 and IE11 requires the following for NgClass support on SVG elements */
import 'classlist.js';  // Run `npm install --save classlist.js`

【讨论】：

【解决方案3】：

我遇到了同样的错误，并且这个特定错误需要数组类。为了使我的库更小，我只导入了数组类。在那之后，我得到了一个不同的错误，它需要经常使用的字符串类，所以我先把这两个带进来。我有点极简主义，所以在需要之前我不想把其他的带进来。

import 'core-js/es6/array';
import 'core-js/es6/string';

【讨论】：