谈一谈对vite的理解

对vite的理解

vite与webpack区别

1.流程方面
webpack会先打包，然后启动开发服务器，请求服务器时直接基于打包结果。
而vite是直接启动开发服务器，请求那个模块在对该模块进行实时编译
由于现代浏览器本身就支持ES Module, 会自动向依赖Module发出请求。vite充分利用这一点，将开发环境下的模块文件，就座位浏览器要执行的文件，而不是像webpac那样进行打包合并。
2.编译时间
由于vite在启动时不需要打包，也就意味着不需要分析模块的依赖、不需要编译，因此启动速度非常快。当浏览器请求某个模块时，在根据需要对模块内容进行编辑。这种按需动态编译的方式，极大的缩减了编译时间，项目越复杂，模块越多，vite的优势越明显。
3.热更新方面
在HMR方面，当改动了一个模块后，仅需让浏览器重新请求该模块即可，不像webpack那样需要把该模块的相关依赖模块全部编译一遍，效率更高。
当需要打包到生产环境时，vite使用传统的rollup进行打包，因此，vite的主要优势在开发阶段。另外，由于vite利用的是ES Module，因此在代码中不可以使用 CommonJS