Angular 2+:IE 11无法获取未定义或空引用的属性"调用"

Question

我有一个问题,Internet Explorer窒息与Webpack的东西.我正在使用Angular-CLI 1.7.4和当前版本的Angular 5.2.10.我收到这个错误:

脚本:5007无法获取未定义或空引用的属性"调用".内联bundle.js(55,12)

这与此问题不同,因为它位于捆绑包中的不同行.这条线看起来像这样:

/******/        modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);

我试着改装的的的WebPack代码node_modules来console.log的moduleId,但它不记录的某些原因.

我找到了这个帖子,很多人都在处理这个问题.我无法看到与我的问题相关的内容.

我没有来自CLI的任何循环依赖性警告.

我已将我的代码恢复到几个不同的先前版本,重新安装了节点模块,我仍然得到相同的错误.那真的很奇怪.

更新:这是我在的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/set';
import 'core-js/es6/reflect';
import 'core-js/es7/reflect';

我也发现了这个问题,这表明很多人都遇到了这个问题,所提供的解决方案也无法解决.

更新1:似乎每次编译都不会发生此问题.如果问题开始,请重新启动Angular-CLI服务器,或重新构建直到它工作.

更新2:我发现没有从Webpack调用console.log的原因.它不一定在 Webpack中.我搜索我node_modules的modules[moduleId].call(module.exports, module, module.exports, __webpack_require__),发现有87次出现.我认为因为它说'webpack'它是webpack的一部分,所以这是我看的第一个地方,这是它确实发生的地方,所以我停在那里以为我找到了它.

此外,我再次遇到此问题,并重新启动了我的Angular-CLI服务器很多次,但我无法获得有效的编译.

这变得至关重要,所以我将在这个问题上提出赏金.

更新:看起来IE正在阻塞Function.prototype.call添加polyfill的方法的invocation().我从inline.bundle.js中捕获了这个.这是最先发生的事情之一:

function(module, exports, __webpack_require__) {

    module.exports = __webpack_require__("./src/polyfills.ts");

}

Answer 1

此错误仅在运行时发生ng serve,并且不会在生产版本中发生,因此问题非关键,并且具有解决方法,如下所示:

解决方法:发生这种情况时,请关闭浏览器,重新启动Angular-CLI dev服务器,然后重新打开浏览器到您的应用程序.(您不需要清除缓存或其他任何内容.)

这可能与我的测试环境有关,而不是其他任何事情.我们一直在使用SauceLabs来测试IE.我们最近也开始使用VirtualBox. 更新:有时在VirtualBox中也会发生这种情况,但奇怪的是,在一个构建中,它有时会出现在一个测试环境中,而不是另一个.

根据这个帖子,github.com/jakehockey10说:

只有在开发者工具打开后进行实时重新加载后才会出现此问题.Chrome和Firefox没有问题,但是如果我在IE11中打开了开发人员工具并且保存了对我的打字稿的更改,几乎100%的时间都会在重新加载时出现这些错误.

此外,Angular 6现已完全发布,并使用了Webpack的新主要版本.我还没有尝试过,但如果有人试图通过升级来解决问题,那将会很高兴.

Answer 2

即使包含上述polyfill,您仍可能使用IE中不支持的功能.相反,你可以试试这个:

 import 'core-js/shim';

这将包括所有的polyfills(无论如何,它并没有真正为你的包添加太多).至少,这将有助于消除polyfill是问题.

参考资料来源:https: //github.com/zloirock/core-js/blob/master/shim.js

祝好运!