vite项目开发常用插件

@vitejs/plugin-vue

作用： 用于编辑vue文件
注意： 该插件适用于vue3

• npm
• 官方仓库
• gitee镜像

plugin-vue-jsx

作用： 添加vue3对tsx和jsx的支持

• npm
• 官方仓库

vite-plugin-svg-icons

作用： 统一引入svg文件资源，作为图标使用

• npm
• 官方仓库

vite-plugin-eslint

作用： 给vite加入运行时的eslint支持

• npm
• 官方镜像

vite-plugin-mock

作用： 用于模拟后端的服务

• npm

• 官方仓库

• gitee镜像

vite-plugin-compression

作用： 提供gzip压缩

• npm
• 官方仓库

vite-plugin-html

作用： 提供index.html的压缩以及在index.html访问变量的功能

• npm
• 官方仓库

rollup-plugin-visualizer

作用： 打包分析

• npm 以及 ts支持库
• 官方仓库

vite-plugin-vue-setup-extend

作用： 解决vue3下 script setup语法糖 下 ，手动设置组件name不方便的问题
注意： 可能会导致vue组件debuger时，断点位置不正确问题，使用前请慎重 （直至0.4.0版本依旧有该问题）

• npm
• 官方仓库

unplugin-vue-components

作用： 实现vue组件库的自动按需导入

• npm
• 官方仓库

unplugin-auto-import

作用： 实现vue函数的自动导入

• npm
• 官方仓库

cross-env

作用： 以一种通用方式，设置环境变量，解决跨平台，环境变量设置方式不同的问题

• npm
• 官方仓库