前端构建工具
- vite：快速冷启动和热更新
- webpack：功能强大，高度可定制化
- Rollup：简洁的配置和高效的代码打包而闻名；ES 模块的支持很好，能有效进行 Tree Shaking，确保输出的代码体积小，避免不必要的代码。
- gulp：基于流的构建工具，使用代码而不是配置文件来控制构建过程
vite
- 生产模式下： Rollup 进行打包
- 开发模式下：利用浏览器对 ESM 的原生支持（快速冷启动和热更新）
1. 为什么vite很快？
1. 冷启动速度：开发模式下依赖浏览器ES模块的原生支持
- 利用浏览器原生支持ES模块特性：webpack需要预先打包所有文件
- 避免打包时间等待：webpack需要在启动时分析依赖关系，耗费时间
Vite 基于ES6moudle特性构建开发服务器。当启动开发服务器时，它只需要启动一个轻量级的 HTTP 服务器，然后直接通过原生的
<script type="module">标签在浏览器请求模块时提供相应文件
Webpack 需要从入口文件开始，解析其中的
import和require语句，以确定项目中所有的模块依赖关系。构建出一个包含所有模块及其依赖关系的有向图。把这些模块打包成一个或多个大的 bundle 文件
2. 热更新快：
- 精准更新: webpack 需要重新构建和更新整个应用或者大部分应用
- 缓存：Vite 利用浏览器的缓存机制，对于未修改的模块，浏览器可以直接使用缓存，不需要重新请求和加载。
因为它是基于 ES 模块构建的，每个模块都有独立的请求路径，所以可以很容易地识别出修改的模块。