Vue编译报错内存溢出问题解决方式

 更新时间:2023年08月25日 09:38:19   作者:DiracKeeko  
这篇文章主要为大家介绍了Vue编译报错内存溢出问题解决方式,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

npm run build报错

Vue项目,打包npm run build报错,内存溢出

有两种报错的表现

1、FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory

2、Error [ERR_WORKER_OUT_OF_MEMORY]: Worker terminated due to reaching memory limit: JS heap out of memory

1、2两种均是JavaScript 堆内存耗尽,导致 Node.js 进程崩溃导致。

本质上这是一个node的问题。

解决方法

1、尝试增加堆内存限制,有全局级和项目级两种方式。

a、在全局增加堆内存限制

环境变量->系统变量中加上

变量名:NODE_OPTIONS

变量值:--max-old-space-size=8192

(不一定是8192这个值,可以自己修改)

b、项目级增加堆内存限制(推荐)

"build": "NODE_OPTIONS=--max-old-space-size=8192 vue-cli-service build --mode test"。 (不一定是8192这个值,可以自己修改)

如果是windows系统可以借助cross-env这个npm包

首先npm i cross-env -D

再修改package.json 中的scripts
"build": "cross-env NODE_OPTIONS=--max-old-space-size=8192 vue-cli-service build --mode test"

2、使用压缩工具,如uglifyjs。目的是减小打包后代码体积。

以上就是Vue编译报错内存溢出问题解决方式的详细内容,更多关于Vue编译报错内存溢出的资料请关注脚本之家其它相关文章!

相关文章

  • vue轮播图插件vue-awesome-swiper

    vue轮播图插件vue-awesome-swiper

    这篇文章主要为大家详细介绍了vue轮播图插件vue-awesome-swiper,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-11-11
  • 基于Vue3编写一个简单的播放器

    基于Vue3编写一个简单的播放器

    这篇文章主要为大家详细介绍了如何基于Vue3编写一个简单的播放器,文中的示例代码讲解详细,对我们学习Vue3有一定的帮助,需要的可以参考一下
    2023-03-03
  • Vue之Axios的异步请求问题详解

    Vue之Axios的异步请求问题详解

    总的来说这并不是一道难题,那为什么要拿出这道题介绍?拿出这道题真正想要传达的是解题的思路,以及不断优化探寻最优解的过程。希望通过这道题能给你带来一种解题优化的思路,Axios是一个开源的可以用在浏览器端和Node JS的异步通信框架,主要作用就是实现AJAX异步通信
    2023-02-02
  • 使用vue实现猜谜卡片游戏

    使用vue实现猜谜卡片游戏

    这篇文章主要为大家详细介绍了如何使用vue实现简单的猜谜卡片游戏,文中的示例代码讲解详细,具有一定的学习价值,感兴趣的小伙伴可以参考一下
    2023-09-09
  • Vue后台中优雅书写状态标签的方法实例

    Vue后台中优雅书写状态标签的方法实例

    在Vue中,我们可以非常便捷地通过标签实现状态的保存,这篇文章主要给大家介绍了关于Vue后台中如何优雅的书写状态标签的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
    2021-08-08
  • vue中同时监听多个参数的实现

    vue中同时监听多个参数的实现

    这篇文章主要介绍了vue中同时监听多个参数的实现方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • Vue.js通用应用框架-Nuxt.js的上手教程

    Vue.js通用应用框架-Nuxt.js的上手教程

    本篇文章主要介绍了Vue.js通用应用框架-Nuxt.js的上手教程,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-12-12
  • Vue分页组件实现过程详解

    Vue分页组件实现过程详解

    Web应用程序中资源分页不仅对性能很有帮助,而且从用户体验的角度来说也是非常有用的。在这篇文章中,将了解如何使用Vue创建动态和可用的分页组件
    2022-12-12
  • Vue3学习笔记之依赖注入Provide/Inject

    Vue3学习笔记之依赖注入Provide/Inject

    provide和inject可以实现嵌套组件之间进行传递数据,这两个函数都是在setup函数中使用的,下面这篇文章主要给大家介绍了关于Vue3学习笔记之依赖注入Provide / Inject的相关资料,需要的朋友可以参考下
    2023-05-05
  • Vue3 Vant组件库使用过程中的避坑点

    Vue3 Vant组件库使用过程中的避坑点

    本片文章主要写了,Vue3开发时运用Vant UI库的一些避坑点。让有问题的小伙伴可以快速了解是为什么。也是给自己做一个记录
    2023-04-04

最新评论