vite 打包优化

安装插件 rollup-plugin-visualizer，用来查看打包后的大小

npm i rollup-plugin-visualizer -D

vite.config.js 中引入 visualizer

import { visualizer } from 'rollup-plugin-visualizer'

plugins: [
    visualizer({open: true})
]

执行打包命令，打包后会生成一个 stats.html，会自动在浏览器中打开

npm run build

echarts 按需引入，chart 组件中改成按需引入，其他配置和完全引入一样

// 核心模块
import * as echarts from 'echarts/core'
// 图表
import {
  BarChart,
  PieChart
} from 'echarts/charts'
// 功能模块
import {
  TitleComponent,
  TooltipComponent,
  GridComponent,
  LegendComponent,
  DatasetComponent
} from 'echarts/components'
// 渲染器，必须
import { CanvasRenderer } from 'echarts/renderers'
echarts.use(
  [
    TitleComponent,
    TooltipComponent,
    GridComponent,
    BarChart,
    PieChart,
    LegendComponent,
    DatasetComponent,
    CanvasRenderer
  ]
);