2022/06/28 react项目报错FATAL ERROR: invalid array length Allocation failed

本文链接：https://blog.youkuaiyun.com/Nighsloth/article/details/125502281

本文介绍了作者在运行前端项目时遇到的内存溢出错误，包括错误分析和一系列解决尝试，如检查电脑内存、清理npm缓存、增加内存限制等。尽管尝试了多种方法，如使用increase-memory-limit插件和调整VSCode设置，问题仍未解决。最终，通过卸载node_modules并用npm重新安装包成功解决了问题。文章提供了多个相关链接供读者参考。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

背景
项目npm start运行后，不一会儿时间终端报错
在这里插入图片描述
项目页面正常显示，控制台报错

报错分析
第一次遇到，先中文分析在这里插入图片描述
网上的搜罗了下，大概原因报错
（可以直接第四步看看是不是和我一样的问题）
1.电脑内存
2.代码问题，有没有循环（但如果是死循环的话，浏览器不会出页面）
3.npm缓存关机
4.increase-memory-limit插件(限制node内存)
5.vscode内存（vscode运行卡顿），vscode cpu占用过高
6.node内存
5.最后，上面的方法都尝试失败了,npm i重新下载安装包成功的
（主要原因之前是cnpm下载的，后面用npm下载安装包就成功了）

不错的解释
在这里插入图片描述

解决措施
1.看电脑内存
我电脑是mac,2021的m1,发现m1的芯片或许本来就有点这个问题
在这里插入图片描述
打开活动监视器，页面大概这样吧

把几个占用高的关闭了，重新运行项目，还是报错

2.检查代码问题
写了三个forEach，确信不是死循环这种

3.清楚npm缓存，npm clean

 npm cache clean --force

之后后再操作，仍报错

4.increase-memory-limit插件,增加node服务器内存限制

1.全局安装插件（cnpm安装成功的,npm要报错）
npm install -g increase-memory-limit
2.执行命令
increase-memory-limit

失败

vue项目还可以使用插件 cross-env
在这里插入图片描述

5.vscode卡顿
设置–》首选项
但是没搜素出follow Symlinks的作用是什么？符号链接目录
在这里插入图片描述

6.扩大node内存

–操作方法
在这里插入图片描述

– react项目启动的代码

终端修改参数再运行，报错

7.卸载直接的node_modules包，直接npm i重新下载，运行

cnpm i 下载出 ./bin下面的文件
在这里插入图片描述

npm i 下载出 ./bin下面的文件
在这里插入图片描述
可能就是安装的文件下东西相差太多了，但是npm和cnpm只是node中包管理器的不同，所以也不知道为什么npm i的包就可以正常运行项目

参考链接
1.几个命令教你如何监控 Node 服务的内存情况
https://juejin.cn/post/6845166891397283854

2.循环代码问题造成oom
https://blog.youkuaiyun.com/tinyint_813/article/details/115715554?ops_request_misc=&request_id=&biz_id=102&utm_term=%20invalid%20array%20length%20Allocati&utm_medium=distribute.pc_search_result.none-task-blog-2_allsobaiduweb~default-0-115715554.142

3.vscode 卡顿
https://segmentfault.com/a/1190000018041547

4.基于node的前端项目编译时内存溢出问题（写得超好，vue,react,Angular不同项目怎么处理都有解决方案）
https://segmentfault.com/a/1190000010437948