Vue热更新出现内存溢出

Vue热更新出现内存溢出

  • vue-cli2遇到此问题的解决办法:
  • vue-cli3遇到此问题的解决办法:
    • 方法一(已测试ok)
    • 方法二(未尝试)

开发项目有一段时间了,随着项目越来越大,打包的时间也相应的变长了,打包时的内存也增多了。这时候产生了一个问题,在发布项目的时候,会出现类似如下错误的提示。‘

 
<--- JS stacktrace --->==== JS stack trace =========================================0: ExitFrame [pc: 3295209E]1: StubFrame [pc: 32946989]
Security context: 0x0f312701 <JSObject>2: replace [0F30B631](this=0x3ec73a65 <String[263]: D:/PDFUND2/trunk/src/pdfundvue/node_modules/babel-loader/lib/
index.js!D:/PDFUND2/trunk/src/pdfundvue/node_modules/vue-loader/lib/selector.js?type=script&index=0!D:/PDFUND2/trunk/
src/pdfundvue/src/components/page/assetnetshareMSSDQry/assetnetshareMSSDQrySelect.vue>,0x1334c6a5 <JSReg...FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory1: 00F4254E node::MakeCallback+37742: 0159C652 v8::internal::Heap::MaxHeapGrowingFactor+95543: 015933F1 v8::internal::ScavengeJob::operator=+165934: 01591F78 v8::internal::ScavengeJob::operator=+113525: 013FC644 v8::internal::StackGuard::HandleInterrupts+100
npm ERR! code ELIFECYCLE
npm ERR! errno 134
npm ERR! pdfundvue@1.0.0 dev: `webpack-dev-server --inline --progress --watch --config build/webpack.dev.conf.js`
npm ERR! Exit status 134
npm ERR!
npm ERR! Failed at the pdfundvue@1.0.0 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.npm ERR! A complete log of this run can be found in:
npm ERR!     D:\Users\xxx\xx\xx\npm-cache\_logs\2019-07-03T05_43_41_196Z-debug.log

原因不难知道,是因为在Node中通过JavaScript使用内存时只能使用部分内存(64位系统:1.4 GB,32位系统:0.7 GB),这个时候,如果前端项目非常的庞大,Webpack编译时就会占用很多的系统资源,如果超出了V8引擎对Node默认的内存限制大小时,就会产生内存溢出的错误。

针对于不同的vue-cli 版本有不同的解决方法

vue-cli2遇到此问题的解决办法:

npm run devnpm run build 直接在前面加上--max_old_space_size=4096

在 package.json 中,补充以下参数

  "scripts": {"start": "npm run dev","dev": "node --max_old_space_size=4096 build/dev-server.js","build": "node --max_old_space_size=4096 build/build.js","lint": "eslint --ext .js,.vue src","pre": "node build/pre.js","dll": "rimraf dist && webpack --progress --colors --config build/webpack.dll.conf.js"},

vue-cli3遇到此问题的解决办法:

方法一(已测试ok)

在 package.json 中,补充一下参数

{"scripts": {"serve": "vue-cli-service serve","build": "vue-cli-service build",#加上这段代码"fix-memory-limit": "cross-env LIMIT=4096 increase-memory-limit"},# 同时安装 2 个依赖包"devDependencies": {"increase-memory-limit": "^1.0.3","cross-env": "^5.0.5",}
}

(1) .执行npm install 来安装2 个依赖包
(2).安装完成后,先执行一次 "fix-memory-limit"
          如果安装失败则需要先删除掉项目的node_modules包
          配置并安装成功后执行npm run fix-memory-limit这句
(3).再执行"serve",就会出现报错了不是内部或外部命令,也不是可运行的程序或之类的错误
(4).将下边文件中"%_prog%"去掉双引号为 %_prog%关键点
(5)接口"serve" 启动即可

在这里插入图片描述
问题解决,可以正常运行

方法二(未尝试)

V8引擎对内存的使用的默认大小限制是1.4G,可以通过node.js命令设置限制来解决这个问题。修改package.json文件中内容,具体如下。

{"scripts": {"serve": "npx --max_old_space_size=6144 vue-cli-service serve","build": "npx --max_old_space_size=6144 vue-cli-service build --modern"},
}

修改完成后重启项目

参考文章
【1】vue-cli3内存溢出,JavaScript heap out of memory
【2】node 内存溢出,解决办法

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/18267.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

若依微服务实现分布式事务

一、基本介绍 1、什么是分布式事务 指一次大的操作由不同的小操作组成的&#xff0c;这些小的操作分布在不同的服务器上&#xff0c;分布式事务需要保证这些小操作要么全部成功&#xff0c;要么全部失败。从本质上来说&#xff0c;分布式事务就是为了保证不同数据库的数据一致…

ssm137基于SSM框架的微博系统+vue

微博系统网站的设计与实现 摘 要 网络技术和计算机技术发展至今&#xff0c;已经拥有了深厚的理论基础&#xff0c;并在现实中进行了充分运用&#xff0c;尤其是基于计算机运行的软件更是受到各界的关注。加上现在人们已经步入信息时代&#xff0c;所以对于信息的宣传和管理就…

家用洗地机哪个品牌好?家用洗地机排行榜前十名

随着洗地机逐渐进入大众视野&#xff0c;这种集吸、拖、洗功能于一体的清洁工具&#xff0c;凭借其高效便捷的特点&#xff0c;成为家庭清洁的新宠。洗地机不仅能够减少地面清洁时间&#xff0c;节省体力&#xff0c;还能提高清洁效果。然而&#xff0c;面对琳琅满目的洗地机品…

Web会话管理

一、会话管理的概念&#xff1a; 在人机交互时&#xff0c;会话管理是保持用户的整个会话活动的互动与计算机系统跟踪过程会话管理分类: 桌面会话管理、浏览器会话管理、Web服务器的会话管理。 二、为什么需要会话管理&#xff1f; HTTP是一种无状态协议&#xff0c;一次请…

java项目之智能家居系统源码(springboot+vue+mysql)

风定落花生&#xff0c;歌声逐流水&#xff0c;大家好我是风歌&#xff0c;混迹在java圈的辛苦码农。今天要和大家聊的是一款基于springboot的智能家居系统。项目源码以及部署相关请联系风歌&#xff0c;文末附上联系信息 。 项目简介&#xff1a; 基于Springboot的智能家居系…

【高校科研前沿】湖北工业大学为第一署名单位在《Science》发表Letters文章:应对青藏高原河流泥沙激增

文章简介 论文名称&#xff1a;Combating sediment surge in Tibetan rivers&#xff08;应对青藏高原河流泥沙激增&#xff09; 相关作者及单位&#xff1a;杨洪教授&#xff08;英国雷丁大学&#xff09;&刘德富教授&#xff08;湖北工业大学&#xff09;&Julian R…

huggingface 笔记:聊天模型

1 构建聊天 聊天模型继续聊天。传递一个对话历史给它们&#xff0c;可以简短到一个用户消息&#xff0c;然后模型会通过添加其响应来继续对话一般来说&#xff0c;更大的聊天模型除了需要更多内存外&#xff0c;运行速度也会更慢首先&#xff0c;构建一个聊天&#xff1a; ch…

灵动微单片机洗衣机方案——【软硬件开发支持】

RAMSUN英尚以洗衣机洗涤主驱电机为例&#xff0c;主驱电机和多电机控制首选MM32SPIN0280.灵动微电子能够提供完整的软硬件开发支持&#xff0c;目前方案已经在主流家电厂出货。 洗衣机方案 皮带洗衣机 DD直驱洗衣机 波轮洗衣机 Mini壁挂和桌面洗衣机 洗涤烘干双变频方案 热泵烘…

uniapp - 文章模块页面

在上一篇文章中&#xff0c;创建了一个空白的文章模块页面。在这一篇文章&#xff0c;让我们来向页面中填充内容。 目录 页面效果涉及uniapp组件1.view2.swiper3.scroll-view4.属性解读1) class"style1 style2 .."2) circular单属性无赋值3) :autoplay"autoplay…

信息标记形式 (XML, JSON, YAML)

文章目录 &#x1f5a5;️介绍&#x1f5a5;️三种形式&#x1f3f7;️XML (Extensible Markup Language)&#x1f516;规范&#x1f516;注释&#x1f516;举例&#x1f516;其他 &#x1f3f7;️JSON (JavaScript Object Notation)&#x1f516;规范&#x1f516;注释&#x…

存内计算从浮点运算优化对数据经济的提升

本篇文章将介绍存内计算技术对于数据经济的提升&#xff0c;我们将从提出问题、解答问题与阐述应用三个方面进行展开介绍&#xff0c;并引入浮点存算、等新兴存算技术进行简要介绍。 一.数据经济&存内计算&#xff0c;结合是否可行&#xff1f; 数据经济与存内计算&#…

浅说线性DP(上)

前言 在说线性dp之前&#xff0c;我们先来聊一聊动态规划是啥&#xff1f; 动态规划到底是啥&#xff1f; 动态规划是普及组内容中最难的一个部分&#xff0c;也是每年几乎必考的内容。它对思维的要求极高&#xff0c;它和图论、数据结构不同的地方在于它没有一个标准的数学…

mysql 01 linux 上安装mysql服务端

01.linux安装 MySQL的大部分安装包都包含了服务器程序和客户端程序&#xff0c;不过在Linux下使用RPM包时会有单独的服 务器RPM包和客户端RPM包&#xff0c;需要分别安装。 1.查看是否已经安装了MySQL rpm -qa | grep mysql如果什么都没有&#xff0c;就是还没有装过MySQL …

基于Pytorch框架的深度学习RegNet神经网络二十五种宝石识别分类系统源码

第一步&#xff1a;准备数据 25种宝石数据&#xff0c;总共800张&#xff1a; { "0": "Alexandrite","1": "Almandine","2": "Benitoite","3": "Beryl Golden","4": "Carne…

数字化农业新时代:图扑农林牧综合监控平台

利用图扑自研 HT for Web GIS 产品&#xff0c;结合遥感技术&#xff0c;构建可交互式的农林牧数据分析平台。该平台围绕地块总览、播种分析、牛只管理、设备查询四个维度&#xff0c;对地区的全貌、农场、村集体分布以及相应的环境进行多样化的可视化展示和进行数据支持&#…

爱岗敬业短视频:成都科成博通文化传媒公司

爱岗敬业短视频&#xff1a;传递正能量&#xff0c;塑造职场新风尚 在当今社会&#xff0c;短视频以其独特的传播方式和广泛的受众群体&#xff0c;成为了信息传播的重要渠道。在众多短视频内容中&#xff0c;以“爱岗敬业”为主题的短视频尤为引人注目&#xff0c;成都科成博…

FreeRtos进阶——队列的特殊用途

信号量与互斥量都一样&#xff0c;都是特殊的队列。但是只有互斥量实现了优先级继承机制。 信号量与互斥量与队列一样&#xff0c;在操作增加或者减少时&#xff0c;必须先关中断在进行操作&#xff01; 信号量创建揭秘 图中信号量的创建过程&#xff0c;在代码中的体现本质就是…

现在股票交易佣金标准最低是万0.854,低佣金炒股开户方式和流程!

股票交易佣金的最低标准是万分之0.854&#xff1b; 证券公司股票交易佣金默认是万分之3&#xff1b; 无门槛的股票交易佣金是万分之1&#xff1b; 万分之0.854的佣金要求投资者资产达到一定规模&#xff0c;不同的证券公司规定不一样。 如果没有经过证券公司客户经理协商开…

【SQL学习进阶】从入门到高级应用(一)

文章目录 MySQL命令行基本命令数据库表的概述初始化测试数据熟悉测试数据 &#x1f308;你好呀&#xff01;我是 山顶风景独好 &#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01; &#x1f49d;希望您在这里可以感受到一份轻松愉快的氛围&#x…

C++牛客周赛43题目分享(3)小红平分糖果,小红的完全平方数,小苯的字符串变化,小红的子数组排列判断

目录 ​编辑 1.前言 2.四道题目 2.1小红平分糖果 2.1.1题目描述 2.1.2输入描述 2.1.3输出描述 2.1.4示例 2.1.5代码 2.2小红的完全平方数 2.1.1题目描述 2.1.2输入描述 2.1.3输出描述 2.1.4示例 2.1.5代码 2.3小苯的字符串变化 2.1.1题目描述 2.1.2输入描述 …