一、问题

最近在写一个 vue 项目,在进行 yarn dev 的时候,经常发现编译崩溃的事情,然后就需要再次 yarn dev

主要的报错信息如下:

FATAL ERROR :CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of

二、解决

问题主要出现在 node 对于内存的限制上,网上的解决方法很多都是基于之前版本的 vue-cli

那个时候的 vue-cli 的 scripts 还是直接使用的 node xxxx 命令,因此无法直接添加 node 运行参数。

基本的解决方法就是增大内存,如果使用新版本的 vue-cli ,scripts 中 dev 是隐藏了 node 参数的:

"scripts": {
    "dev": "webpack-dev-server --inline --progress  --config  build/webpack.dev.conf.js",
    "start": "npm run dev",
    "build": "node build/build.js"
  },

需要直接去修改 webpack.cmd

文件路径在:

node_modules/.bin/webpack.cmd

在 node 命令上加上参数即可。

之前的文件内容:

@IF EXIST "%~dp0\node.exe" (
  "%~dp0\node.exe"  "%~dp0\..\webpack\bin\webpack.js" %*
) ELSE (
  @SETLOCAL
  @SET PATHEXT=%PATHEXT:;.JS;=;%
  node  "%~dp0\..\webpack\bin\webpack.js" %*
)

修改之后的文件内容:

@IF EXIST "%~dp0\node.exe" (
  "%~dp0\node.exe"  "%~dp0\..\webpack\bin\webpack.js" %*
) ELSE (
  @SETLOCAL
  @SET PATHEXT=%PATHEXT:;.JS;=;%
  node  "--max-old-space-size=4096 %~dp0\..\webpack\bin\webpack.js" %*
)