解决Vue3.0项目多次运行后,项目体积增大问题(高达60G)

简介: 解决Vue3.0项目多次运行后,项目体积增大问题(高达60G)

.cache中的compression-webpack-plugin每次增加的空间,正好是整个node_modules增加的空间。  

compression-webpack-plugin
npm i compression-webpack-plugin -D

配置

if (process.env.NODE_ENV ==='production'){
  config.plugin('compressionPlugin')
  .use(new compressionWebpackPlugin({
    // filename: '[path].gz[query]',
    algorithm: 'gzip',
    // test: /.(js|css|txt|html|ico|svg)(?.*)?$/i,
    test:/.(js|css|html|ttf|otf)(?.*)?$/i,
    threshold: 10240,
    minRatio: 0.8,
    deleteOriginalAssets: false
   }));
}
  configureWebpack: {
    // provide the app's title in webpack's name field, so that
    // it can be accessed in index.html to inject the correct title.
    name: name,
    resolve: {
      alias: {
        '@': resolve('src')
      }
    },
    plugins: process.env.NODE_ENV === 'production' ? [
      new CompressionWebpackPlugin({
        algorithm: 'gzip',
        test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
        threshold: 10240,
        minRatio: 0.8
        // deleteOriginalAssets: true// 压缩完是否保留原文件
      })
    ] : []
  },
相关文章
|
2月前
|
缓存 监控 UED
升级 Vue3 时,如何减少打包体积的增加?
升级 Vue3 时,如何减少打包体积的增加?
223 59
|
2月前
|
API UED
升级 Vue3 后,项目的打包体积会有什么变化?
升级 Vue3 后,项目的打包体积会有什么变化?
136 57
|
28天前
|
存储 JavaScript 安全
vue项目打包优化:缩小体积productionSourceMap设置,使用cdn加速
vue项目打包优化:缩小体积productionSourceMap设置,使用cdn加速
46 0
|
3月前
|
缓存 前端开发 JavaScript
微前端集成优化:让所有子应用体积更小,加载更快!
【8月更文挑战第17天】微前端集成优化:让所有子应用体积更小,加载更快!
67 1
微前端集成优化:让所有子应用体积更小,加载更快!
|
3月前
|
资源调度 JavaScript 前端开发
如何大幅减少 Vue.js 中的包大小和加载时间,提升用户体验!
如何大幅减少 Vue.js 中的包大小和加载时间,提升用户体验!
|
6月前
|
缓存 前端开发 算法
前端需要加载一个大体积的文件时,可以这么优化
前端需要加载一个大体积的文件时,可以这么优化
|
6月前
|
缓存 自然语言处理 前端开发
JS/CSS体积减少了67%,我们是如何做到的?
JS/CSS体积减少了67%,我们是如何做到的?
60 1
|
6月前
|
缓存 前端开发 JavaScript
代码如何跑得更快?Vue性能提速指南
代码如何跑得更快?Vue性能提速指南
129 0
代码如何跑得更快?Vue性能提速指南
|
6月前
|
缓存 算法 API
Vue3.0 性能提升主要是通过哪几方面体现的?
Vue3.0 性能提升主要是通过哪几方面体现的?
86 0
|
数据采集 JavaScript 前端开发
超越React,JS代码体积减少90%!它为何是2023年最好的Web框架?
超越React,JS代码体积减少90%!它为何是2023年最好的Web框架?