升级 Angular 项目后“未捕获的 TypeError：Object.setPrototypeOf 在 null 或 undefined 上调用”

Posted 2023-03-13

【中文标题】升级 Angular 项目后“未捕获的 TypeError：Object.setPrototypeOf 在 null 或 undefined 上调用”

【英文标题】："Uncaught TypeError: Object.setPrototypeOf called on null or undefined" after upgrading Angular project

【发布时间】：2017-11-17 06:06:03

【问题描述】：

我有一个 Angular 应用程序，它运行良好。但是，在使用 yarn upgrade 升级依赖项后，我收到了这个神秘的错误：

main.bundle.js:6779 Uncaught TypeError: Object.setPrototypeOf called on null or undefined
    at setPrototypeOf (<anonymous>)
    at webpackJsonp.../../../../../src/ui-components/src/components/phone-number-input/phone-number-input.component.ts.__extends (main.bundle.js:6779)
    at phone-number-input.component.ts:24
    at Object.../../../../../src/ui-components/src/components/phone-number-input/phone-number-input.component.ts (phone-number-input.component.ts:69)
    at __webpack_require__ (bootstrap 8652e46ce92ee05aa5a3:54)
    at Object.../../../../../src/ui-components/src/components/phone-number-input/phone-number-input.module.ts (phone-number-input.component.ts:24)
    at __webpack_require__ (bootstrap 8652e46ce92ee05aa5a3:54)
    at Object.../../../../../src/ui-components/src/ui-components.module.ts (roman-numeral.pipe.ts:10)
    at __webpack_require__ (bootstrap 8652e46ce92ee05aa5a3:54)
    at Object.../../../../../src/app/app.module.ts (app.component.ts:31)
webpackJsonp.../../../../../src/ui-components/src/components/phone-number-input/phone-number-input.component.ts.__extends @ main.bundle.js:6779
(anonymous) @ phone-number-input.component.ts:24
../../../../../src/ui-components/src/components/phone-number-input/phone-number-input.component.ts @ phone-number-input.component.ts:69
__webpack_require__ @ bootstrap 8652e46ce92ee05aa5a3:54
../../../../../src/ui-components/src/components/phone-number-input/phone-number-input.module.ts @ phone-number-input.component.ts:24
__webpack_require__ @ bootstrap 8652e46ce92ee05aa5a3:54
../../../../../src/ui-components/src/ui-components.module.ts @ roman-numeral.pipe.ts:10
__webpack_require__ @ bootstrap 8652e46ce92ee05aa5a3:54
../../../../../src/app/app.module.ts @ app.component.ts:31
__webpack_require__ @ bootstrap 8652e46ce92ee05aa5a3:54
../../../../../src/main.ts @ environment.ts:10
__webpack_require__ @ bootstrap 8652e46ce92ee05aa5a3:54
2 @ ui-components.module.ts:108
__webpack_require__ @ bootstrap 8652e46ce92ee05aa5a3:54
webpackJsonpCallback @ bootstrap 8652e46ce92ee05aa5a3:25
(anonymous) @ main.bundle.js:1

当遵循指定的文件和行号时，我找不到任何问题。 IDE 显示没有问题，编译也没有错误。

当试图注释掉错误中提到的组件时，它只是开始提到另一个组件。

可能是什么原因造成的，我该如何调试/调查这个神秘错误？

【参考方案1】：

没有任何有意义的错误消息并且堆栈跟踪几乎没有告诉我任何信息。我决定调查实际触发此问题的原因。考虑到它是在依赖项升级后出现的，我已经为yarn.lock 提取了差异，并开始恢复它的某些部分，并在此过程中重新编译应用程序，检查它是否会使错误消失。经过一些繁琐的工作，我发现这是由于 TypeScript 从 2.3.4 更新到 2.4.0 造成的。

所以下一步是研究the changelog 并分析我的代码中可能出现的问题。

因此，最后我建议您更频繁地升级您的依赖项（这将有助于减少升级大小，以防您需要对其进行调查）。

我希望它会对某人有所帮助。干杯！

更新

经过进一步调查，我发现了发生此错误的确切情况，因此我将 posted an issue 发送到 Angular GitHub 存储库。

最后，这是 TypeScript 中的 actual culprit issue。

【讨论】：

确实有帮助！谢谢，斯拉瓦 :)

希望我能多次投票。从字面上拯救了我的一天。非常感谢！

救命稻草。 '纳夫说。

您成功解决了这个问题吗？我有一个similar issue，这个错误似乎仍然存在。