一、问题
vue-cli3
(现在已经出4了,貌似并没有解决这个问题)在执行npm run serve
或yarn serve
时有可能出现内存溢出问题,更多的情况是在命令执行完,修改代码后,再次自动编译的时候。
其实,大多数单页面应用是不会出现这个问题的。但是需求是无止境的,我们的项目使用多页面的方式(个别独立功能的页面会单独使用一个xx.html
,而不是都使用index.html
作为入口),具体配置方式见https://cli.vuejs.org/zh/config/#pages。这种情况下,很大概率出现内存溢出的情况。
二、原因
vue-cli
使用 webpack-dev-server
作为开发时的服务器,本质上是个node.js
程序,内存溢出是webpack-dev-server
运行过程中出现的。
三、解决方式
知道原因就好解决,方法不唯一,思路就是:增大node.js
程序的运行内存。方法之一,修改package.json的scripts下的serve命令,如下:
"serve": "node --max_old_space_size=10240 node_modules/@vue/cli-service/bin/vue-cli-service.js serve",
具体大小可以根据实际情况设置,我这里设置10240是可以的。
解决一个问题,开心。OK,结束!