什么是vite
Vite是一种新型的前端构建工具，能够显著提升前端的开发体验，主要有两部分组成
- 一个开发服务器，它基于 原生 ES 模块 提供了 丰富的内建功能，如速度快到惊人的 模块热更新（HMR）。
- 一套构建指令，它使用 Rollup 打包你的代码，并且它是预配置的，可输出用于生产环境的高度优化过的静态资源。
vite的优点
快速的开发体验
Vite 的构建速度非常快，由于采用了浏览器原生的模块化系统，因此可以避免传统构建工具的静态打包和编译，从而提高了开发效率和构建速度。同时，Vite 还支持 Hot Module Replacement（HMR）和快速刷新等功能，可以实时更新代码和预览修改效果，让开发者专注于开发过程中的实际需求。
简单易用的配置
Vite 的配置非常简单易用，通常只需要一个配置文件即可完成项目的构建和部署。Vite 的配置文件是一个 JavaScript 模块，允许开发者自定义构建和部署的方式，同时也提供了一些默认配置选项，如端口号、代理、压缩等。
支持多种前端框架和语言
Vite 不仅支持常见的前端框架如 Vue、React 和 Angular 等，还支持多种前端语言，如 TypeScript、CoffeeScript 和 Sass 等。这使得开发者可以更加灵活地选择自己熟悉的技术栈，并且能够快速地集成各种框架和语言，提高了开发效率和代码质量
vite的实现原理（以vue为例）
vite利用浏览器原生支持esModule的特性，利用import和export导入导出模块，同时实现了按需加载
- 浏览器在import模块时会发起一个http请求，vite通过koa创建一个http服务，拦截.js和vue文件，转换引入包（非/,./,../开头的）的文件路径，如下转换成以'/@module'开头的模块，然后在通过/@module/XXX与node_module里的真实文件位置，建立一个映射的方式，找到文件
// 转换前
import {createApp} from 'vue'
// 转换后
import {createApp} from '/@module/vue'
- 处理.vue文件
如上图，将.vue文件里export的script内容，挂在__script下,template的内容封装成一个.vue?type=template的文件路径，通过import引入，并挂在__script.render下，然后通过对应的方法处理虚拟dom或是其他实现了转换 3. 处理proce.env.NODE_ENV为undefined的问题 http服务器拦截html文件，添加一个script，里边添加proce.env.NODE_ENV的设置，然后返回
