Linux 构建 Vue 项目报错 JavaScript heap out of memory(2024/06/26)

Linux 构建 Vue 项目报错 JavaScript heap out of memory(2024/06/26)

文章目录

    • [Linux 构建 Vue 项目报错 JavaScript heap out of memory(2024/06/26)](#Linux 构建 Vue 项目报错 JavaScript heap out of memory(2024/06/26))
      • [一. 产生环境](#一. 产生环境)
      • [二. 问题描述](#二. 问题描述)
      • [三. 原因分析](#三. 原因分析)
      • [四. 解决方法](#四. 解决方法)
      • [五. 疑问](#五. 疑问)

一. 产生环境

  • Debian GNU/Linux 12;
  • NodeJS 16.19.0;

二. 问题描述

在 Linux 环境下,通过 npm run build 构建 Vue 项目的时候遇到如下错误:

shell 复制代码
FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

三. 原因分析

根据报错信息可知是堆内存空间不足导致的,但构建所用的 Linux 机器物理内存为 256G,通过监控资源占用发现在 node 构建时内存并未占满,所以猜测是系统对进程所用的最大内存进行了限制。可能的限制如下:

  1. 查看 Linux 系统对进程可分配最大内存的限制;

    shell 复制代码
    $ ulimit -m
    unlimited

    结果为 unlimited,即不限制,因此不是系统限制了进程所能分配的最大内存。

  2. 查看 Node.js 的默认内存限制;

    shell 复制代码
    $ node -e "console.log(v8.getHeapStatistics().heap_size_limit / 1024 / 1024 + ' MB')"
    4144 MB

    结果为 4144 MB,显而易见问题出在这里,Node.js 的默认内存限制太小导致构建时获取不到足够的堆内存。

四. 解决方法

调整 Node.js 的默认内存限制,例如增加到 16G,下面介绍两种实现方法(原理相同):

  1. 命令行设置环境变量;

    • Windows

      shell 复制代码
      $ set NODE_OPTIONS="--max_old_space_size=16384" && npm run build
    • Linux

      shell 复制代码
      $ export NODE_OPTIONS="--max_old_space_size=16384" && npm run build
  2. package.json 的 scripts 部分直接增加内存限制;

    • Windows

      json 复制代码
      "scripts": {
        "build": "set NODE_OPTIONS='--max_old_space_size=16384' && vue-cli-service build"
      }
    • Linux

      json 复制代码
      "scripts": {
        "build": "NODE_OPTIONS='--max_old_space_size=16384' vue-cli-service build"
      }
    • 跨平台

      shell 复制代码
      $ npm install cross-env
      json 复制代码
      "scripts": {
        "build": "cross-env NODE_OPTIONS='--max_old_space_size=16384' vue-cli-service build"
      }

五. 疑问

Windows 环境下 Node.js 的默认内存限制也是 4144 MB,但是在不增加 Node.js 默认内存限制的情况下可以构建成功,原因不详???

相关推荐
kite01213 小时前
浏览器工作原理06 [#]渲染流程(下):HTML、CSS和JavaScript是如何变成页面的
javascript·css·html
крон3 小时前
【Auto.js例程】华为备忘录导出到其他手机
开发语言·javascript·智能手机
apocelipes4 小时前
Linux c 运行时获取动态库所在路径
linux·c语言·linux编程
coding随想5 小时前
JavaScript ES6 解构:优雅提取数据的艺术
前端·javascript·es6
努力学习的小廉5 小时前
深入了解linux系统—— 进程池
linux·运维·服务器
年老体衰按不动键盘5 小时前
快速部署和启动Vue3项目
java·javascript·vue
灵感__idea5 小时前
JavaScript高级程序设计(第5版):无处不在的集合
前端·javascript·程序员
秃头菜狗5 小时前
各个主要目录的功能 / Linux 常见指令
linux·运维·服务器
2301_793102496 小时前
Linux——MySql数据库
linux·数据库
星辰引路-Lefan6 小时前
深入理解React Hooks的原理与实践
前端·javascript·react.js