记录(综合百度所有方法实力填坑)vue旧项目使用webpack-dev-server搭建,windows系统下内存溢出导致的模块热更新失败问题

首先,在windows系统下,进入项目 npm run dev,报错young object promotion failed Allocation failed - JavaScript heap out of memory(新的对象升级失败分配失败-JavaScript堆内存不足)
效果见图:
在这里插入图片描述
然后我们通过修改加大设置max-old-space-size =10000,以及webpack-dev-server的目录地址为:./node_modules/webpack-dev-server/bin/webpack-dev-server,(注:在mac上运行时此路径稍有不同)发现项目暂时可以正常运行。
见图:
在这里插入图片描述
但是一旦修改任何vue页面,项目将自动停止运行,需重新npm run dev运行,
报错如下:
在这里插入图片描述
接下来我们试试大部分百度推荐的方法:
全局安装:
npm install -g increase-memory-limit
运行
increase-memory-limit
npm 异步运行
在package.json里修改
“scripts”: {
“fix-memory-limit”: “cross-env LIMIT=2048 increase-memory-limit”
},
“devDependencies”: {
“increase-memory-limit”: “^1.0.3”,
“cross-env”: “^5.0.5”
}
执行一次npm run fix-memory-limit
效果如图:
在这里插入图片描述
然后 运行项目,修改代码,更新代码依然报错:
在这里插入图片描述
然后我们试着在build文件夹下有个webpack.dev.conf.js文件。
然后添加一个配置项:inline: false 即可关闭热更新操作。在这里插入图片描述
依然失败:
在这里插入图片描述
因此我们发现,此报错跟热更新无关;

然后尝试是否为node的版本问题:
首先安装安装nvm,帮助切换node版本,
下载地址:https://github.com/coreybutler/nvm-windows/releases
注意下面四个包:
nvm-noinstall.zip: 这个是绿色免安装版本,但是使用之前需要配置
nvm-setup.zip(推荐):这是一个安装包,下载之后点击安装,无需配置就可以使用,方便。
Source code(zip):zip压缩的源码
Sourc code(tar.gz):tar.gz的源码
然后安装选择一直next就行了,在此不做截图演示

然后通过配置路径和下载源
在nvm安装路径下setting.txt文件中配置如下信息:
设置nvm路径(相当于setting.txt中的root:):
设置nodejs路径(相当于setting.txt中的path:):
nvm node_mirror https://npm.taobao.org/mirrors/node/
nvm npm_mirror https://npm.taobao.org/mirrors/npm/
如图:
在这里插入图片描述
接下来使用:安装指定版本的node:
nvm install <版本号>
使用指定版本node:
nvm use <版本号>

node完成安装后,出现npm -v报错,npm指令不存在问题,
需打开nvm的安装文件夹,修改settings文件(如上图),
修改完成之后,
在cmd中使用nvm 卸载当前指定的node版本,之后再重新安装即可;

最终通过重重排查版本,将node npm定为
在这里插入图片描述

更新模块编译成功;
在这里插入图片描述
以上是本人填坑过程,大家可以借鉴。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值