vite优化项目常用插件【记录】

import vue from '@vitejs/plugin-vue'; // vue文件编译 import vueJsx from '@vitejs/plugin-vue-jsx'; // JSX语法编写组件 import legacy from '@vitejs/plugin-legacy'; // 使用它来提供对旧版本浏览器的支持 import purgeIcons from 'vite-plugin-purge-icons'; // 便高效的使用Iconify中所有的图标 import windiCSS from 'vite-plugin-windicss'; // windi css 样式框架 import VitePluginCertificate from 'vite-plugin-mkcert'; // 使用 mkcert 为 vite https 开发服务提供证书支持 import vueSetupExtend from 'vite-plugin-vue-setup-extend'; // 使 vue 脚本设置语法支持 name 属性。 import { createHtmlPlugin } from 'vite-plugin-html'; // HTML 压缩能力; EJS 模版能力; 多页应用支持; 支持自定义entry; 支持自定义template import { VitePWA } from 'vite-plugin-pwa'; // 使用pwa功能 import { viteMockServe } from 'vite-plugin-mock'; // 提供本地和生产模拟服务 import compressPlugin from 'vite-plugin-compression'; // 使用gzip或者brotli 来压缩资源 import { createStyleImportPlugin } from 'vite-plugin-style-import'; // 框架按需引入。elementUI、Ant design... import visualizer from 'rollup-plugin-visualizer'; // 可视化并分析您的 Rollup 捆绑包以查看哪些模块占用了空间 import { viteThemePlugin, antdDarkThemePlugin, mixLighten, mixDarken, tinycolor, } from 'vite-plugin-theme'; // 用于动态更改界面主题色 import viteImagemin from 'vite-plugin-imagemin'; // 压缩图片资源 // 当你使用该插件的时候,指定好存放svg的文件夹。再按照指定的方式去访问svg图片。就可以再不产生http请求的情况下渲染出svg图片。 // 【在main.js】import 'virtual:svg-icons-register'; // 引入svg icon注册脚本 import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';

// iconify图标 // 使用vite-plugin-purge-icons插件 https://iconify.design/

// windicss css集成框架 // 使用vite-plugin-windicss https://windicss.org/

rollup-plugin-visualizer 【vite优化项目常用插件【记录】】可视化并分析您的 Rollup 捆绑包以查看哪些模块占用了空间
vite优化项目常用插件【记录】
文章图片

    推荐阅读