在 Angular 中添加 PWA 时超出最大调用堆栈大小

Posted 2023-02-21

【中文标题】在 Angular 中添加 PWA 时超出最大调用堆栈大小

【英文标题】：Maximum call stack size exceeded when adding PWA in Angular

【发布时间】：2019-05-14 08:12:18

【问题描述】：

我正在尝试在我的应用程序中安装服务工作者，但它显示 执行以下命令后出现以下错误。

ng 添加@angular/pwa --project ServiceWorkerdemo

ng add @angular/pwa --project ServiceWorkerdemo
Installing packages for tooling via npm.
npm WARN rollback Rolling back node-pre-gyp@0.10.0 failed (this is probably harmless): EPERM: operation not permitted, lstat 'path\ServiceWorkerdemo\node_modules\fsevents\node_modules'
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted "os":"darwin","arch":"any" (current: "os":"win32","arch":"x64")

+ @angular/pwa@0.11.3
updated 1 package and audited 47713 packages in 25.858s
found 0 vulnerabilities

Installed packages for tooling via npm.
**Maximum call stack size exceeded**

它显示超出最大调用堆栈大小错误消息。

即使我清除了缓存，它仍然再次显示相同的错误。

    >npm cache clean --force
npm WARN using --force I sure hope you know what you are doing.

**path\ServiceWorkerdemo>ng add @angular/pwa --project ServiceWorkerdemo
Installing packages for tooling via npm.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted "os":"darwin","arch":"any" (current: "os":"win32","arch":"x64")

+ @angular/pwa@0.11.3
updated 1 package and audited 47713 packages in 26.054s
found 0 vulnerabilities

Installed packages for tooling via npm.
Maximum call stack size exceeded

请给我一个答案，而不是标记为重复，我有 已尝试清除缓存选项，但仍显示错误消息。 您也可以在 Image 中看到。

删除节点包后。

提前致谢。

【问题讨论】：

尝试“npm cache clean”，否则“npm cache clean --force”，然后执行“ng add @angular/pwa”

仍然显示相同的错误信息。

【参考方案1】：

我也有同样的问题。通过指定以前的稳定版本，我能够让它工作：

ng 添加@angular/pwa@0.8.7 --project my-project-name

【参考方案2】：

除非您使用 Angular 7 或更高版本，否则您需要执行类似的操作

ng 添加@angular/pwa@v6-lts --project ...

确保安装了适用于您的 Angular 版本的正确模块版本。

（另见https://github.com/angular/angular-cli/issues/12914）

我遇到了与您完全相同的错误（Angular 6.1），并且能够以这种方式成功解决。

【参考方案3】：

你可以查看这个SO post 的解决方案，它说这个错误是由一个函数调用另一个函数引起的，依此类推，直到它达到调用堆栈限制。这称为函数的递归循环。

为了修复它，请确保您的递归函数具有能够满足的基本情况：

(function a(x) 
    // The following condition 
    // is the base case.
    if ( ! x) 
        return;
    
    a(--x);
)(10); 

您可以查看 Chrome 开发工具的资源标签。