遇到的问题:项目第一次运行时,没问题不报错,然后保存项目,热更新重新加载时,控制台会输出以下信息,导致项目断开,需要重新运行

  • 这就是webpack 运行项目内存溢出(Last few GCs)

在这里插入图片描述
解决方法

  • vue-cli2
    npm run dev 和 npm run build 直接在前面加上–max_old_space_size=4096
 "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",
  },
  • vue-cli3

1.scripts中添加一句指令
2.安装两个npm包 : increase-memory-limit 和cross-env
3.安装完成后,先执行一次 npm run fix-memory-limit,然后serve启动即可

 "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"
 }

vue-cli3 的解决办法修复原理:

它不能像vue-cli2直接在 npm run dev中间添加一个参数,只有使用安装模块fix-memory-limit的方式生效,其原理是修改了node_modules中一个叫做.bin(通常就是第一个文件夹)的文件夹内所有文件权限。

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐