vue3 + vite 项目打包优化

vue项目打包之后生成的dist包体积太大，超过10M, 进行影响项目加载速度。本文章从作者的实践操作写出如何做项目优化。

一、分析包体积过大的原因

项目初始打包体积为10.6M。

使用 rollup-plugin-visualizer 做打包视图分析。

安装命令：

npm install --save-dev rollup-plugin-visualizer

在vite.config.js中引入

import {
    visualizer } from 'rollup-plugin-visualizer'
export default defineConfig({
   
  plugins: [
    vue(),
    visualizer({
   
      open: true,
      emitFile: false,