开发环境的区别

1. vite 自己实现 server，不对代码打包，充分利用浏览器对<script type = module>的支持
   • 假设 main.js 引入了 vue
   • 该 server 会把 import { createApp } from 'vue'改为import { createApp } from '/node_modules/.vite/vue.js'，这样浏览器就知道去哪里找 vue.js 了
2. webpack-dev-server 常使用 bable-loader 基于内存打包，比 vite 慢很多很多
   • 该 server 会把 vue.js 的代码（递归地）打包进 main.js

生产环境区别

1. vite 使用 rollup + esbuild 来打包 JS 代码
2. webpack 使用 babel 来打包 JS 代码，比 esbuild 慢很多
   • webpack 其实也可以使用 esbuild，但是配置很麻烦

文件处理时机

1. vite 只会在你请求某个文件时处理该文件
2. webpack 会提前打包好 main.js ，等你请求的时候直接输出打包好的 JS

vite 的缺点？

1. 热更新经常失败，原因不明
2. 有些功能 rollup 不支持，需要自己写插件补充
3. 不支持非现代浏览器