解决uni-app编译后vendor.js文件过大

GZIP

GZIP是网站压缩加速的一种技术，用于优化用户体验，开启后可以加快我们web页面的打开速度，原理是经过服务器压缩，客户端浏览器快速解压的原理，可以大大减少了网站的流量。

1、摇树优化

摇树优化（Tree-Shaking），顾名思义，摇晃树干，将枯死无用的枝条摇掉，仅保留有用的树枝。对应到框架层面理解，就是一个框架的众多组件和API，可以按需使用，把未引用的框架部分裁剪掉。Tree-Shaking 最早由 Rollup 提出，属于死码删除的一种形式。

开启摇树优化的方式非常简单，只需要在manifest.json中打开一个开关即可。

2、开启gzip压缩

1.安装插件

npm i compression-webpack-plugin

npm i webpack

使用时请注意版本，我用最新版本报错Cannot read property ‘tapPromise’ of undefined，后来降低版本

我这里用的分别是6.1.1和4.46.0

2.在项目根目录新建vue.config.js文件,写入以下内容。

const CompressionWebpackPlugin = require('compression-webpack-plugin');

module.exports = {
  configureWebpack:{
	  plugins:[
		new CompressionWebpackPlugin(
			{
				filename: "[path][base].gz",
				algorithm: "gzip",
				test: /\.js$/,
				threshold: 10240,
				minRatio: 0.8,
				exclude: /node_modules/,
			}
		)
	  ]
  }
}