1. build 视图分析依赖文件
分析项目中的文件大小及引用情况，是优化前的重要一步,在vite下我们可以利用Rollup Plugin Visualizer工具来做项目的依赖分析
（1）安装方式如下:
npm install --save-dev rollup-plugin-visualizer
yarn add --dev rollup-plugin-visualizer
（2）安装完之后，在vite.config.js中加上配置
// vite.config.js
import { defineConfig } from "vite";
import uni from "@dcloudio/vite-plugin-uni";
import { visualizer } from "rollup-plugin-visualizer";
// https://vitejs.dev/config/
export default defineConfig({
// base: 'https://static-xxxx.bspapp.com/', // uniCloud 前端网页托管资源地址（主要是应用编译后的js，图片等静态资源，可以配置为二级目录）
plugins: [
uni(),
visualizer({
gzipSize: true,
brotliSize: true,
emitFile: false,
filename: "test.html", //分析图生成的文件名
open:true //如果存在本地服务端口，将在打包后自动展示
}),
],
base: "./",//打包上传服务器的相对路径
});
更多配置
（3）运行打包命令npm run build会出现以下的图表
2. gzip压缩文件
（1）安装vite自己做的一个插件yarn add vite-plugin-compression
（2）引入文件
import viteCompression from 'vite-plugin-compression';
plugins: [
viteCompression()
],
（3）运行打包命令，此时打包文件中会多出现很多.gz的文件，即为压缩成功，打开视图分析器查看压缩后的视图
发现：好像没啥太大的变化，大家知道是为什么吗？
参考文章：
