用webpack热加载的时候经常挂掉怎么办

àì夳堔傛蜴生んèń 2023-07-09 02:28 10阅读 0赞

最近用webpack热加载项目时经常挂掉，并报

95% emittingFATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory

*  1

此类错误，网上查了下，这是由于编译的时间内存泄漏,因为前端项目如果非常的庞大，webpack 编译时就会占用很多的系统资源，如果超出了V8对 Node 默认的内存限制大小就会出现这个错误了；解决办法是我们在Node 在启动时可以传递 –max-old-space-size 或 –max-new-space-size 来调整内存大小的使用限制；

node –max-old-space-size=2048  
node –max-new-space-size=2048 来调整内存大小的使用限制

知道解决办法之后赶紧动手撸码，打开package.json 中加入；但是我一打开我的package.json傻眼了，因为是用vue-cli生成的项目，运行开发环境命令中没有node？

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

*  1
 *  2
 *  3
 *  4
 *  5

因为webpack自己帮我们封装了 npm run dev的方法，网上大神解决了我的困惑；

1、打开node\_modules文件夹，就是安装node依赖包的这个文件夹；

2、打开.bin文件夹

3.找到webpack-dev-server.cmd；这个文件并用编辑器打开；打开后我的如下：

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

*  1
 *  2
 *  3
 *  4
 *  5
 *  6
 *  7

这里就有dev环境的node运行命令了,我们只要在倒数第二行node后面加上上文提到的代码就ok了；注意空格；

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