记录排查node_modules包为什么会越来越大?

这篇具有很好参考价值的文章主要介绍了记录排查node_modules包为什么会越来越大?。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、排查node_modules包为什么会越来越大

1. 事件背景

中间接手一个团队的项目,npm i 之后,启动服务脚本,正常运行,整个项目很简单,用的若依模板,但是运行几天后发现,硬盘少了十几个G,一开始,还以为是系统的垃圾缓存,清了下,发现远远达不到少的空间,想想这几天干的事,箭头直指该项目,用npkill跑了下,果然node_moudules 竟然夸张有18个G。

2. 排查过程

  • 现象

    • 删除node_modules,重新安装,只有几百兆的大小。
    • 运行npm run dev命令之后,会立即增加几十兆,重复多次运行,发现未增加空间。
    • 修改代码,实时编译之后,发现空间增加5兆左右,只要修改一次就增加一次。
  • 尝试解决方案

    • 替换包管理工具,yarn 发现问题依旧存在。
  • 考虑是不是缓存引起文章来源地址https://www.toymoban.com/news/detail-504033.html

    • 查阅vue-cli官网,发现官网有这么一句话。记录排查node_modules包为什么会越来越大?
    • 至此,.cache文件夹进入视野。
    • 是不是这个loader引起的呢?是不是去除这个loader就能解决该问题。
      • vue.config.js中的chainWebpack中配置如下代码:
        module.exports = {
          chainWebpack(config) {
              config.module.rule('vue').uses.store.delete('cache-loader');
              config.module.rule('js').uses.store.delete('cache-loader');
           }
        },
        
      • 代码打印,确实已删除了loader,但是现象依旧存在。
    • 会不会是其他插件引起的,仔细观察后发现,.cache中的compression-webpack-plugin每次增加的空间,正好是整个node_modules增加的空间。
    • 查看vue.config.js,插件的配置确实存在compression-webpack-plugin,且没有区分环境。
    • 直接先注释,运行项目,观察现象消失。
    • 至此,问题终于定位到了。

3. 解决方案

  • compression-webpack-plugin,压缩资源,配合nginx加速资源加载,优化体验。
  • 解决方式:针对该插件直接区分下环境,只有在生产打包的时候,进行启用即可。

到了这里,关于记录排查node_modules包为什么会越来越大?的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 记录--为什么没有人能讲清楚 BFC?

    CSS 规范(英文) | 中文翻译 浮动,绝对定位的元素,非块盒的块容器(例如inline-blocks,table-cells和table-captions),以及’overflow’不为’visible’的块盒(当该值已被传播到视口时除外(except when that value has been propagated to the viewport))会为其内容建立新的块格式化上下文 在一个

    2024年02月05日
    浏览(48)
  • 明明已经安装了’sklearn‘但是为什么还是出现ModuleNotFoundError: No module named ‘sklearn‘

    ModuleNotFoundError: No module named \\\'sklearn\\\' 然后上网查了查,用了各种方法,终于成功了,遇到相同困扰的同学可以试试这个方法 先安装一下sklearn的依赖库:Numpy、Scipy、matplotlib。 然后安装了一下 scikit-learn 

    2024年02月12日
    浏览(53)
  • 记录--为什么推荐用svg而不用icon?

    使用背景: 1.因为svg图标在任何设备下都可以高清显示,不会模糊。而icon会在显卡比较低的电脑上有显示模糊的情况 2.svg图标在页面render时 速度会比icon稍微快一点 3.实现小程序换肤功能 ;方案见:www.yuque.com/lufeilizhix… SVG基础可参考:www.yuque.com/lufeilizhix… inline svg是目前前

    2024年02月08日
    浏览(52)
  • 微信为什么使用 SQLite 保存聊天记录?

      SQLite 是一个被大家低估的数据库,但有些人认为它是一个不适合生产环境使用的玩具数据库。事实上,SQLite 是一个非常可靠的数据库,它可以处理 TB 级的数据,但它没有网络层。接下来,本文将与大家共同探讨 SQLite 在过去一年中最新的 SQL 功能。   SQLite “只是”一个库

    2024年02月10日
    浏览(48)
  • 记录--post为什么会发送两次请求?

    在前段时间的一次面试中,被问到了一个如标题这样的问题。要想好好地去回答这个问题,这里牵扯到的知识点也是比较多的。 那么接下来这篇文章我们就一点一点开始引出这个问题。 在浏览器中,内容是很开放的,任何资源都可以接入其中,如 JavaScript 文件、图片、音频

    2024年02月12日
    浏览(52)
  • 记录--强制缓存这么暴力,为什么不使用协商缓存

    前段时间在看面经的时候,发现很多份面经中都被问到了 强缓存 和 协商缓存 。因此我觉得有必要写一篇文章来好好聊聊这两者。 浏览器缓存是浏览器在本地磁盘对用户最近请求过的文档进行存储,当访问者再次访问同一页面时,浏览器就可以直接从本地磁盘加载文档,其中浏览

    2024年02月10日
    浏览(48)
  • 已经安装了 python 库,但是为什么调用不了;ModuleNotFoundError: No module named ‘xxx库名‘

    ModuleNotFoundError: No module named ‘autox’ 但是通过 pip list 查看是可以发现这个库的!!!! 最近在尝试一些 自动机器学习方面的内容Auto ML,于是就装了一下 autox 这个库。将 github 上的仓库克隆下来之后,进入该仓库的主文件目录,使用 下面的指令进行安装。 通过 pip list 查看

    2024年02月12日
    浏览(49)
  • 记录--为什么要使用 package-lock.json?

    随着 JavaScript 在现代软件开发中的日益重要地位, Node.js 生态系统中的 npm 成为了不可或缺的工具。在 npm 管理依赖的过程中, package-lock.json 文件的作用日益凸显。本文将深入探讨为什么要使用 package-lock.json ,以及它在项目开发中的重要性。 在讨论 package-lock.json 的重要性之

    2024年02月11日
    浏览(41)
  • [20231013]为什么刷新缓存后输出记录顺序发生变化3.txt

    [20231013]为什么刷新缓存后输出记录顺序发生变化3.txt --//当年提的问题,链接http://blog.itpub.net/267265/viewspace-2763181/= [20210316]为什么刷新缓存后输出记录顺序发生变化.txt, --//正好别人问我,顺便我重复看了一下,顺便解答这个问题,实际上也许解答不对,许多行为我仅仅是猜测

    2024年02月08日
    浏览(46)
  • [20231023]为什么刷新缓存后输出记录顺序发生变化6.txt

    [20231023]为什么刷新缓存后输出记录顺序发生变化6.txt --//前几天做了单表刷新缓存后输出记录顺序发生变化的情况,测试2个表的情况时遇到一个奇怪的现象。 --//我前面的测试18c,如果使用10046跟踪看不到我遇到的情况,我想使用strace跟踪,发现该机器配置使用asm,strace跟踪无法

    2024年02月06日
    浏览(50)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包