Angular 2+:IE 11无法获取未定义或空引用的属性“调用” [英] Angular 2+: IE 11 Unable to get property 'call' of undefined or null reference
问题描述
我遇到的问题是Internet Explorer在Webpack上出现问题。我正在使用Angular-CLI 1.7.4和当前版本的Angular 5.2.10。我收到此错误:
I'm having an issue with Internet Explorer choking on something with Webpack. I'm using Angular-CLI 1.7.4, and Angular 5.2.10, the current versions. I'm getting this error:
SCRIPT:5007无法获取未定义或null
引用的属性调用。内联bundle.js(55,12)
SCRIPT:5007 Unable to get property 'call' of undefined or null reference. Inline bundle.js (55,12)
这与此问题,因为它位于捆绑包中的不同行。该行看起来像这样:
This is different than this issue, in that it is on a different line in the bundle. The line looks like this:
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
我尝试在 node_modules
到 console.log
moduleId
,但由于某种原因它没有记录。
I tried modding the webpack code in the node_modules
to console.log
the moduleId
, but it doesn't log for some reason.
我找到了这个主题,其中很多人们正在处理这个问题。我无法看到与我的问题相关的内容。
I found this thread, where a lot of people are dealing with this issue. I'm not able to see what is relevant to my issue.
我没有来自CLI的任何循环依赖性警告。
I do not have any circular dependency warnings from the CLI.
我已经将我的代码恢复到几个不同的先前版本,重新安装了节点模块,我仍然得到相同的错误。这真的很奇怪。
I've reverted my code to several different previous versions, reinstalled the node modules, and I still get the same error. That's really strange.
更新:以下是我所拥有的polyfills:
UPDATE: Here are the polyfills I have in:
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';
我还发现此问题,显示许多人遇到此问题,并且提供的解决方案无效。
I also found this issue, which shows that a number of people are having this problem, and the solutions offered are not working.
更新1:似乎每次编译都不会出现此问题。如果问题开始,请重新启动Angular-CLI服务器,或重新构建直到它工作。
更新2:我找到了控制台的原因.log没有从Webpack调用.log。它不一定是 in Webpack。我在 node_modules
中搜索了 modules [moduleId] .call(module.exports,module,module.exports,__ webpack_require __)
,发现有87次发生。我认为因为它说'webpack'它是webpack的一部分,所以这是我看的第一个地方,这是发生的地方,所以我停在那里以为我发现了它。
UPDATE 2: I've found the reason the console.log wasn't being called from Webpack. It's that it wasn't necessarily in Webpack. I searched my node_modules
for modules[moduleId].call(module.exports, module, module.exports, __webpack_require__)
, and found there were 87 occurrences. I assumed that because it said 'webpack' that it was part of webpack, so that was the first place I looked, which is a place where it does occur, so I stopped there thinking I'd found it.
另外,我又遇到了这个问题,并且重启了我的Angular-CLI服务器很多次,但是我无法得到一个编译器正在发挥作用。
Also, I'm having this problem again, and restarted my Angular-CLI server a bunch of times, but I'm not able to get a compile that is working.
这变得至关重要,所以我将在这个问题上提出赏金。
This is becoming critical, so I'm going to raise a bounty on this question.
更新:看起来IE正在阻塞添加polyfill的方法的调用( Function.prototype.call
)。我从inline.bundle.js中捕获了这个。这是最先发生的事情之一:
UPDATE: It looks like IE is choking on the invocation (Function.prototype.call
) of the method that adds the polyfills. I captured this from inline.bundle.js. It's one of the first things that happens:
function(module, exports, __webpack_require__) {
module.exports = __webpack_require__("./src/polyfills.ts");
}
推荐答案
此错误仅在运行 ng服务
时发生,并且不会在生产版本中发生,因此问题非关键,并且有一个解决方法,如下所示:
This error only happens when running ng serve
, and will not occur in a production build, so the issue is non-critical, and has a workaround, as follows:
解决方法:发生这种情况时,请关闭浏览器,重新启动Angular-CLI dev服务器,然后重新打开浏览器到您的应用程序。(您无需清除缓存或其他任何东西。)
Workaround: When this occurs, close your browser, restart Angular-CLI dev server, and reopen the browser to your app. (You don't need to clear cache, or anything else.)
这可能与我的测试环境有关,而不是其他任何事情。我们一直在使用SauceLabs来测试IE。我们最近也开始使用VirtualBox。 更新:有时也会在VirtualBox中发生这种情况,但奇怪的是,在一次构建时,它有时会发生在一个测试环境中,而不是另一个。
This may have more to do with my testing environment than anything else. We've been using SauceLabs for testing IE. We recently started using VirtualBox as well. Update: This happens in VirtualBox sometimes as well, but it's odd that on one build, it sometimes occurs in one testing environment, and not the other.
每此主题,github。 com / jakehockey10说:
Per this thread, github.com/jakehockey10 says:
我只有在使用
进行实时重载后才遇到此问题开发者工具打开。 Chrome和Firefox没有问题,但是如果我在IE11中打开开发人员工具
并且保存对我的打字稿的更改,几乎100%的时间都是
,我会在重新加载时收到这些错误。
I'm having this issue only after a live-reload occurs with the Developer Tools open. No issue with Chrome and Firefox, but if I have the Developer Tools open in IE11 and save a change to my typescript, nearly 100% of the time, I get these errors upon reload.
此外,Angular 6现已完全发布,并使用新的主要版本的Webpack。我还没有尝试过,但如果有人尝试通过升级来解决问题,我会很高兴。
Also, Angular 6 is now in full release, and uses a new major version of Webpack. I haven't tried it yet, but would be good to know if someone has tried resolving the issue by upgrading.
这篇关于Angular 2+:IE 11无法获取未定义或空引用的属性“调用”的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!