vite 为什么比 webpack 快
- webpack 是先打包再启动开发服务器,vite 是直接启动开发服务器,然后按需编译依赖文件
- 现代浏览器本身就支持 ES Modules,会主动发起请求去获取所需文件。vite 充分利用这点,将开发环境下的模块文件,就作为浏览器要执行的文件,而不是像 webpack 先打包,交给浏览器执行的文件是打包后的;
- 由于 vite 启动的时候不需要打包,也就无需分析模块依赖、编译,所以启动速度非常快。当浏览器请求需要的模块时,再对模块进行编译,这种按需动态编译的模式,极大缩短了编译时间,当项目越大,文件越多时,vite 的开发时优势越明显;
- 在 HRM 方面,当某个模块内容改变时,让浏览器去重新请求该模块即可,而不是像 webpack 重新将该模块的所有依赖重新编译;
- 当需要打包到生产环境时,vite 使用传统的 rollup 进行打包,所以,vite 的优势是体现在开发阶段,另外,由于 vite 使用的是 ES Module,所以代码中不可以使用 CommonJs;
参考文章