vite打包原理

vite

工程化开发：打包工具

启动速度很快

核心原理还是webpack  把webpack封装了，把webpack对象封装了

和vue2整体结构几乎一致

webpack两种模式：开发&生产

代码打包编译，本地起一个web服务器实时预览编译后的结果

build 命令模块打包编译输出到dist，dist部署到后台

vite开发和生产原理完全不一样

node_modules vite东西很少

比如有些插件很大如果打包主js，那么主js会很大。那么就通过script引入

安装的模块很干净很少

打包编译原理

快的原因：没有编译的过程

webpack打包原理：

1. 入口
2. 分析依赖构建依赖关系图
3. 打包成bundle保存在虚拟内存中
4. 第一次冷启动，之后热启动

vite快的原因：

把编译放在了浏览器预览阶段，devServer并没有把所有模块打包在一起

开发模式原理：

type=module 希望浏览器支持模块规范

生产环境下

rollup配置

图片处理 es/commonjs处理