Vite:rollup-plugin-visualizer查看打包体积分析report报告

简介: Vite:rollup-plugin-visualizer查看打包体积分析report报告

安装依赖

pnpm i rollup-plugin-visualizer -D

配置

vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { visualizer } from 'rollup-plugin-visualizer'
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  build: {
    rollupOptions: {
      plugins: [visualizer()]
    },
  }
})

打包之后会生成一个文件stats.html

image.png

参考


相关文章
|
缓存 JavaScript CDN
关于vite打包优化,你了解多少
关于vite打包优化,你了解多少
|
JSON 前端开发 算法
vite打包优化vite-plugin-compression的使用
【8月更文挑战第4天】vite打包优化vite-plugin-compression的使用
2447 4
Eslint-------error ‘Vue‘ is not defined no-undef
Eslint-------error ‘Vue‘ is not defined no-undef
|
移动开发 开发框架 JavaScript
uni-app 与 Vue H5 项目通讯
uni-app 与 Vue H5 混合开发app的通讯方法
3841 0
uni-app 与 Vue H5 项目通讯
|
自然语言处理 JavaScript 前端开发
拯救浏览器兼容性:Babel是前端开发的必备神器(一)
拯救浏览器兼容性:Babel是前端开发的必备神器
|
JavaScript 前端开发 容器
微应用框架-----乾坤
微应用框架-----乾坤
|
11月前
|
数据可视化 Apache 开发者
趣码乐园 Apache ECharts 6.0 功能介绍
作为一种布局,它还允许开发者将各种图表类型和组件结合,创造出灵活复杂的可视化作品:
|
缓存 JavaScript
vue页面缓存keep-alive的include不生效解决方案
vue页面缓存keep-alive的include不生效解决方案
|
JavaScript
VUE之vxe-table高级表格(表格内增删改、导入、导出、自定义打印、列设置隐藏显示等)用法
VUE之vxe-table高级表格(表格内增删改、导入、导出、自定义打印、列设置隐藏显示等)用法
9908 0
VUE之vxe-table高级表格(表格内增删改、导入、导出、自定义打印、列设置隐藏显示等)用法
|
UED
使echarts图例legend只选中一个(selectedMode)
本文介绍了如何在ECharts图表中设置图例(legend)的选中模式为单选('single'),以确保在有多个图例时,用户只能选择一个图例项进行展示,从而提升图表的可读性和用户体验。
1781 2
使echarts图例legend只选中一个(selectedMode)