node_modules\.cache\compression-webpack-plugin文件越来越大

最新推荐文章于 2024-08-30 10:14:23 发布
最新推荐文章于 2024-08-30 10:14:23 发布
阅读量1.7k 收藏 7
点赞数 4
分类专栏： vue项目 javaScirt 文章标签： webpack vue.js 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zm9998/article/details/129286536
版权

 只要执行一次代码compression-webpack-plugin文件就会越来越大，已到159G~
原因：因为没有配置开发和生产环境，所以即使在开发环境时它也在执行compression-webpack-plugin

解决：简单的方法就是直接删掉.cache这个文件；但不能根治！既然是原因是环境那么就配置环境来解决！

配置.env文件

 

 

 

 

 因为自身项目没有生产和开发url，也没有测试环境，所以就刚需了

 

三七z-
关注
专栏目录
使用CompressionPlugin压缩解决打包后文件过大的问题
Juant_的博客
10-11 5543
vue cli版本：4.5.13 安装： npm i compression-webpack-plugin@5.0.1 -D 注：版本过高会报错 TypeError: Cannot read property 'tapPromise' of undefined vue.config.js const CompressionPlugin = require('compression-webpack-plugin'); module.exports = { configu...
Vue配置compression-webpack-plugin实现Gzip压缩
m0_67392010的博客
03-09 3190
gzip简介 HTTP协议上的gzip编码是一种用来改进web应用程序性能的技术，web服务器和客户端（浏览器）必须共同支持gzip。目前主流的浏览器，Chrome,firefox,IE等都支持该协议。 简单来说，gzip是一种压缩技术。经过gzip压缩后页面大小可以变为原来的30%甚至更小，这样，用户浏览页面的时候速度会快得多。 那么客户端和服务器之间是如何通信来支持gzip的呢？通过下图我们可以很清晰的了解。 nginx启用gzip gzip on; # 开启Gzip gzip_static on;
improve-gzip引入后node_modules中.cache compression-webpack-plugin占用内存过多
2301_76671906的博客
12-28 1422
gzip引入后node_modules中.cache compression-webpack-plugin占用内存过多
vue项目打包压缩静态资源—使用compression-webpack-plugin
最新发布
niuniu2878499107的博客
08-30 1587
vue项目打包压缩静态资源—使用compression-webpack-plugin
node_modules中的.cache文件夹的占用空间越来越大
weixin_42248417的博客
07-20 3381
node_modules中的.cache文件夹的占用空间越来越大
vue解决打包后文件过大的问题-使用压缩插件打包后压缩文件-compression-webpack-plugin
浩星
06-29 2816
前言： 在用vue开发项目的时候，经常会面临一个文件，就是打包以后文件太大，首页加载时间长的问题，一般我们会从压缩文件，cdn引入文件，加载整合雪碧图等等的方式来优化，这里来谈谈压缩文件，主要使用的插件：compression-webpack-plugin 压缩文件优点： 1，打包后页面加载速度变快（文件都小了） 2，打包完的文件会把我们需要的体积比较大的文件根据功能界面拆分开 比较：很明显的感觉文件变多了，每一个的体积变小了 压缩前： 压缩后： ...
vue项目中node_modules体积变大及webpack-CompressionWebpackPlugin
lalaladamowang的博客
07-29 1785
针对CompressionWebpackPlugin插件可以自行百度，是一个gzip压缩的插件，目的是提高http访问速度，前端打包时开启，并且配置nginx即可。原因在于在vue.config.js中配置了CompressionWebpackPlugin，并且此插件默认开启cache缓存。在前端vue项目中，每启动一次项目，node_modules的体积就会变大，基本上半个月就可以达到100G左右。在vue.config.js中关闭此插件的cache就不会出现node_modules体积变大的问题。
Vue3.2.33、 VueCLI4.5.0打包 chunk-vendors.js 文件过大解决方案（compression-webpack-plugin）
QC班长的博客
04-28 3347
最近项目发布到公网服务器，发现首次打开加载时太慢了，查看js文件发现chunk-vendors.js太大了，于是想着优化，发现了其中一种方案是使用压缩插件compression-webpack-plugin，压缩打包编译后的代码。将文件打包成 .gz 文件，然后通过 nginx 的配置，让浏览器直接解析 .gz 文件，可以大大提升文件加载的速度，浏览器可以直接解析 .gz 文件并解压。 压缩文件格式介绍 .gz：浏览器可以直接解析并解压。 .br：BR 文件是使用 Brotli（一种开源数据压缩算
compression-webpack-plugin GZip插件打包报错 ValidationError: Compression Plugin Invalid Options
Jane_96的博客
08-19 2492
安装插件： yarn add compression-webpack-plugin 配置webpack.js ： const CompressionPlugin = require("compression-webpack-plugin"); return ( plugins: [ new BundleAnalyzerPlugin(), isEnvProductio...
code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: compression-webpack-plugin@3.1.0 npm ERR! Found: webpack@3.12.0 npm ERR! node_modules/webpack npm ERR! peer webpack@"^2.0.0 || ^3.0.0 || ^4.0.0" from @soda/friendly-errors-webpack-plugin@1.7.1 npm ERR! node_modules/@soda/friendly-errors-webpack-plugin npm ERR! @soda/friendly-errors-webpack-plugin@"^1.7.1" from @vue/cli-service@3.12.1 npm ERR! node_modules/@vue/cli-service npm ERR! dev @vue/cli-service@"^3.3.0" from the root project npm ERR! peer webpack@"2 || 3 || 4" from babel-loader@7.1.5 npm ERR! node_modules/babel-loader npm ERR! babel-loader@"^7.1.2" from vue-photo-preview@1.1.3 npm ERR! node_modules/vue-photo-preview npm ERR! vue-photo-preview@"^1.1.3" from the root project npm ERR! 11 more (eslint-loader, extract-text-webpack-plugin, ...) npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer webpack@"^4.3.0 || ^5.0.0" from compression-webpack-plugin@3.1.0 npm ERR! node_modules/compression-webpack-plugin npm ERR! dev compression-webpack-plugin@"^3.1.0" from the root project npm ERR! npm ERR! Conflicting peer dependency: webpack@5.86.0 npm ERR! node_modules/webpack npm ERR! peer webpack@"^4.3.0 || ^5.0.0" from compression-webpack-plugin@3.1.0 npm ERR! node_modules/compression-webpack-plugin npm ERR! dev compression-webpack-plugin@"^3.1.0" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! C:\Users\zcybi\AppData\Local\npm-cache\_logs\2023-06-08T02_41_32_750Z-eresolve-report.txt
06-09
具体原因是因为你的项目中使用了 `compression-webpack-plugin@3.1.0`，这个插件的依赖要求 webpack 版本为 `^4.3.0 || ^5.0.0`，但是你的项目中已经安装了 webpack@3.12.0。这导致了依赖冲突，npm 无法正确解析依赖...
swiper安装一直失败
m0_71803050的博客
09-08 1678
1
npm-install-cache:从缓存安装node_modules
05-03
npm-install-cache 在类似Unix的系统上从缓存安装node_modules 。 npm install -g npm-install-cache 用法 导航到节点项目并运行 npm-install-cache 如果自上次运行以来对package.json进行了任何更改，脚本将执行npm install并存储node_modules目录的副本，则这些将在下次执行脚本时使用。
关于webpack优化的几个插件介绍
前端李小白的博客
07-29 1755
以下都是我在vue项目中使用过关于webpack的几个插件 1、hard-source-webpack-plugin HardSourceWebpackPlugin是webpack的插件，为模块提供中间缓存步骤。为了查看结果，您需要使用此插件运行webpack两次：第一次构建将花费正常的时间。第二次构建将显着加快（大概提升90%的构建速度） 安装：npm install --save-dev hard-source-webpack-plugin 配置： const HardSourceWebpackPlug
Vue 打包 chunk-vendors.js 文件过大解决方案（compression-webpack-plugin）
卡尔特斯
08-24 1万+
主篇 Vue 打包 chunk-vendors.js 文件过大导致页面加载缓慢解决方案。 根据主篇内容继续通过 compression-webpack-plugin 插件处理 chunk-vendors.js 文件过大的问题。 创建 vue.config.js 文件，后续配置都需要用到配置文件。 前端将文件打包成 .gz 文件，然后通过 nginx 的配置，让浏览器直接解析 .gz 文件，可以大大提升文件加载的速度。 安装插件 npm 安装 // 安装报错的话看下面注释，用下面的版本..
解决 vue 项目开发越久 node_modules包越大的问题
学习 记录 总结 分享
01-20 2152
解决 vue 项目开发越久 node_modules包越大的问题命令可以清空本地项目的node_modules.cache ，通过命令行的方式快速清空这些缓存。请注意，执行此命令将永久删除 .cache 文件夹及其内容，因此请谨慎使用.cache文件几乎不占用内存了，node_modules依赖包由1.6G减少到了450M，大大减少了电脑内存占用。项目也可以正常运行。
记录排查node_modules包为什么会越来越大？
东东爱编码博客
06-10 8872
node_modules包越来越大
清除node_modules 缓存
热门推荐
昔人'
05-05 4万+
当清node_modules 出现某一些包错误时候，查不到原因时候，可以适当的清除缓存试试。删掉重新安装 rm -rf node_modules npm cache clean npm install
vue 项目 node_module下的.cache作用
ivan5277的博客
06-07 980
通常情况下，这些缓存文件对项目运行是可选的，也就是说，即使删除了它们，项目也能正常运行，只不过下一次构建或启动时，构建速度可能会变慢，因为所有缓存都需要重新生成。：除 Webpack 和 Babel 外，项目的构建过程中可能还会用到 ESLint、TypeScript 编译器、以及各种加载器和插件，它们也可能在。但请注意，在执行删除操作前，确保你的项目源代码是处于正常状态，并且没有正在进行的构建任务。目录中包含了 Webpack 的编译缓存，帮助在不做任何源码变动的情况下，快速重新打包应用。
node_modules.cache是什么东西
PC_136的博客
08-22 2441
cache文件的产生是由webpack4的插件cache-loader生成的，node_modules里下载了cache-loader插件，很多朋友都是vuecli工具生成的项目，内置了这部分设置，使用在配置文件例如vue.config里看不到这部分设置。此外，在 Webpack 4 中，部分插件是默认启用缓存功能的（例如压缩代码的 Terser 插件等），当然.cache文件下的4个插件其实也是默认启用了webpack的缓存功能。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值