浅谈构建工具
前端工程痛点
资源
？ 模块化、资源编译、产物质量、开发效率
浏览器的标准跟不上开发的迭代
前端构建工具的意义：
Vite概要介绍
新一代前端构建工具 两大组成部分： No-bundle开发服务，源文件无需打包 生产环境基于Rollup的Bunlder 特征：
- 高性能
- 简单易用
当下传统构建工具的瓶颈： 缓慢的启动和热更新 原因：bundle性能开销、JavaScript语言的性能瓶颈 =>趋势： 浏览器对原生ESM的普遍支持； ：无需打包项目代码、天然按需加载、可以利用文件级的浏览器缓存 基于原生语言编写前端编译工具链 Esbuild：打包、编译、压缩；性能极高，在vite中被深度使用
Vite上手实战
生产环境Tree Shaking 优化原理： import语句依赖关系，简单来说用什么引入什么 在构建阶段将未使用到的代码删除 配置文件里的build：基于生产环境的运行
Vite整体架构
开发阶段：
依赖预打包
关键技术：单文件编译，使用Esbuild（不支持类型检查；不支持语法降级到ES5）
生产阶段：
代码压缩：Esbuild作为默认压缩工具
插件机制：开发阶段模拟Rollup；生产阶段直接使用
Vite进阶路线
深入双引擎：Esbuild、rollup.js->官方文档
Vite插件开发：
为什么？抽离核心逻辑、易于扩展
参考资料：Vite插件开发文档
JS编译工具Babel
JavaScript语法标准繁多，浏览器支持程度不一
开发者需要使用高级语法
高级语法->低级语法的转换
深入了解底层标准：ESM规范
总结
今天的课程主要讲了Vite这个新兴的前端构建工具的一些了解知识。记得第一次写项目的时候用的还是Vue Cli，刚再去搜索就发现Vue Cli在维护，写着推荐使用Vite了。真是长江后浪推前浪。
