_Vite

指引

在浏览器支持ES模块之前,没有__原生__机制模块化开发
打包:使用工具抓取,将源码模块串联在浏览器中运行
webpack,rollup parcel
Vite 解决数量级模块串联,HMR过慢的问题,将应用模块划分为源码以及依赖两类
- 依赖 : 开发时不会变动的js,组件库
- 源码 ...需要转换的 .vue css Jsx 等
Vite以原生的ESM方式服务源码,实际上是让浏览器接管了打包程序的工作,即当前屏幕的源码被使用才会处理
市场上现有的模块打包器都是重建整个包,使得效率很低,更新速度与体积成负反馈,后通常是将开发服务器的内容存于内存,更改时使模块一部分失活,但也需要重新构构建并重载整个页面,代价是丢失了页面当前的状态,后来有了HMR,允许热替换,但仍然会受应用体积影响速度
生产环境为什么仍需打包
- tree-shaking 去除无用代码
- 懒加载
- chunk分割

vite由两部分组成
- 一个开发服务器,基于原生ES模块,提供了丰富的内建功能,速度快到惊人的模块热更新
- 一套构建指令,使用rollup打包你的代码,并且它是预配置的,可以输出用于生产环境的优化过的静态资源
index.html