前端构建工具Webpack、Rollup、Vite对比

（未完待续...🙇）

Vite

一种新型前端构建工具，能够显著提升前端开发体验。它主要由两部分组成：

• 一个开发服务器，它基于 原生 ES 模块 提供了 丰富的内建功能，如速度快到惊人的 模块热更新（HMR）。
• 一套构建指令，它使用 Rollup 打包你的代码，并且它是预配置的，可输出用于生产环境的高度优化过的静态资源。

tip

Vite内部使用的也是Rollup来打包📦！从这个角度看，个人更倾向于将Vite和Webpack归类为应用构建器， 而Rollup更像是一个轻量的打包工具🔧。

使用推荐

1、打包开源库： 直接上Rollup! 2、打包应用程序： 看应用程序 需不需要兼容老浏览器？如果不考虑兼容老浏览器，建议用 vite。 dev 开发方面：vite 提供 dev 服务器，以及比 webpack 快的多的热更新，dev 开发的体验更好， prd 生产方面：vite 打生产包，实际上用的就是 rollup，打的生产包比用 webpack 小了很多，有不错的性能提升， 另外：理论上 chorme63 以上 可以开箱即用，chorme63 以下也不是完全不能用，需要自己加 polyfill 或 vite 插件。