解决vue-cli项目开发运行时内存暴涨卡死电脑问题


Posted in Javascript onOctober 29, 2019

最近开发一个vue项目时遇到电脑卡死问题,突然间系统就非常卡,然后卡着卡着就死机了,鼠标也动不了了,只能冷启动。而且因为是突然卡死,没来得及打开任务管理器。

最开始以为是硬盘的问题,但是在卡死几次后,就想到把任务管理器开着玩项目,看看到底是不是哪个程序把硬盘或者CPU占满了导致的卡死。经过一番排查,发现是node.js进程的内存一直在暴涨,内存直接100%,然后系统将所有休眠进程换到虚拟内存,但是还是不够,就一直换直到崩盘,硬盘也被占满100%。

这时候我才知道是运行项目开发环境导致的。然后想到前段时间更新了项目的依赖(更新前没发生过内存爆的问题),就逐一排查,发现是

解决vue-cli项目开发运行时内存暴涨卡死电脑问题

 这三个依赖的问题。如果强制版本号为3.10.0,如上图中那样,就不会发生问题。如果改为"^3.10.0",就会发生问题。

记录下遇到的这个问题,分享给大家,也给自己加深一下印象。

SASS预处理器推荐:

因为众所周知的node-sass在windows系统上的一系列(cao)问(dan)题,我推荐大家使用dart-sass(包名为"sass"),完爆node-sass。(也可参考sass-loader官方github的readme)

附上我的项目的整个依赖:

{
"dependencies": {
    "@dclovec/ts-tools": "^1.0.3",
    "@types/echarts": "^4.1.10",
    "axios": "^0.19.0",
    "core-js": "^2.6.5",
    "echarts": "^4.2.1",
    "element-ui": "^2.11.1",
    "vue": "^2.6.10",
    "vue-amap": "^0.5.10",
    "vue-class-component": "^7.0.2",
    "vue-property-decorator": "^8.1.0",
    "vue-router": "^3.0.3",
    "vuex": "^3.0.1"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "3.10.0",
    "@vue/cli-plugin-typescript": "3.10.0",
    "@vue/cli-service": "3.10.0",
    "compression-webpack-plugin": "^3.0.0",
    "sass": "^1.22.9",
    "sass-loader": "^7.1.0",
    "terser-webpack-plugin": "^2.1.2",
    "typescript": "^3.4.3",
    "vue-template-compiler": "^2.6.10"
  }
}

总结

以上所述是小编给大家介绍的解决vue-cli项目开发运行时内存暴涨卡死电脑问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
基于jquery的大众点评,分类导航实现代码
Aug 23 Javascript
js几秒以后倒计时跳转示例
Dec 26 Javascript
js数组方法扩展实现数组统计函数
Apr 09 Javascript
js+html5实现的自由落体运动效果代码
Jan 28 Javascript
原生JS实现旋转木马式图片轮播插件
Apr 25 Javascript
JavaScript结合Bootstrap仿微信后台多图文界面管理
Jul 22 Javascript
node+express制作爬虫教程
Nov 11 Javascript
详解Javascript几种跨域方式总结
Feb 27 Javascript
Vue Cli 3项目使用融云IM实现聊天功能的方法
Apr 19 Javascript
Vue 自适应高度表格的实现方法
May 13 Javascript
JavaScript中跨域问题的深入理解
Mar 04 Javascript
Vue elementUI表单嵌套表格并对每行进行校验详解
Feb 18 Vue.js
JS操作字符串转数字的常见方法示例
Oct 29 #Javascript
Vue axios 将传递的json数据转为form data的例子
Oct 29 #Javascript
详解Vue 项目中的几个实用组件(ts)
Oct 29 #Javascript
JS操作json对象key、value的常用方法分析
Oct 29 #Javascript
JQuery 实现文件下载的常用方法分析
Oct 29 #jQuery
Vue 设置axios请求格式为form-data的操作步骤
Oct 29 #Javascript
js单线程的本质 Event Loop解析
Oct 29 #Javascript
You might like
在PHP中使用redis
2013/11/04 PHP
Symfony控制层深入详解
2016/03/17 PHP
PHP编程计算日期间隔天数的方法
2017/04/26 PHP
PHP封装的mysqli数据库操作类示例
2019/02/16 PHP
PHP Swoole异步读取、写入文件操作示例
2019/10/24 PHP
彪哥1.1(智能表格)提供下载
2006/09/07 Javascript
jquery 面包屑导航 具体实现
2013/06/05 Javascript
javaScript array(数组)使用字符串作为数组下标的方法
2013/11/19 Javascript
基于jquery实现的图片在各种分辨率下未知的容器内上下左右居中
2014/05/11 Javascript
第三章之Bootstrap 表格与按钮功能
2016/04/25 Javascript
微信小程序 五星评分(包括半颗星评分)实例代码
2016/12/14 Javascript
Vue数据驱动模拟实现1
2017/01/11 Javascript
使用vue.js写一个tab选项卡效果
2017/03/25 Javascript
AngularJS  ng-repeat遍历输出的用法
2017/06/19 Javascript
JavaScript之Map和Set_动力节点Java学院整理
2017/06/29 Javascript
Three.js入门之hello world以及如何绘制线
2017/09/25 Javascript
跟混乱的页面弹窗说再见
2019/04/11 Javascript
vue视图不更新情况详解
2019/05/16 Javascript
js常用正则表达式集锦
2019/05/17 Javascript
nodejs中实现修改用户路由功能
2019/05/24 NodeJs
React传值 组件传值 之间的关系详解
2019/08/26 Javascript
JavaScript 斐波那契数列 倒序输出 输出100以内的质数代码实例
2019/09/11 Javascript
JavaScript命令模式原理与用法实例详解
2020/03/10 Javascript
微信小程序实现滑动操作代码
2020/04/23 Javascript
基于Vue3.0开发轻量级手机端弹框组件V3Popup的场景分析
2020/12/30 Vue.js
[01:32:50]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第一场 1月25日
2021/03/11 DOTA
Python 深入理解yield
2008/09/06 Python
Python将阿拉伯数字转换为罗马数字的方法
2015/07/10 Python
python使用代理ip访问网站的实例
2018/05/07 Python
Html5游戏开发之乒乓Ping Pong游戏示例(一)
2013/01/21 HTML / CSS
中国最大的团购网站:聚划算
2016/09/21 全球购物
Johnson Fitness澳大利亚:高级健身器材
2021/03/16 全球购物
建筑装饰学院室内设计专业个人自我评价
2013/12/07 职场文书
学校群众路线专项整治方案
2014/10/31 职场文书
会计工作检讨书
2015/02/19 职场文书
人为什么会“幸灾乐祸”?
2019/08/06 职场文书