Vue-cli webpack 编译内存溢出

Vue-cli webpack 编译内存溢出

一、问题

最近在写一个 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" %*
)

• 文章已经结束啦