vite在前端工程中的作用
构建工具为了解决前端工程的什么问题？
- 前端的模块化要求
- 兼容浏览器，编译高级语法
- 线上代码的质量问题
- 项目的开发效率（项目的冷启动、热更新）
构建工具怎么解决这些问题？
1)模块化方案
- 提供模块加载方案
- 兼容不同模块规范
- 主流的三大模块化方案有CommonJs、AMD、ESModule
2)语法转译
1.高级语法转译，如sass、typescript等 2.资源加载，如图片、字体、work
3)产物质量
1.产物压缩，如产物压缩、代码混淆、Tree Shaking、语法降级
4)开发效率
1、HMR、构建提速
为什么Vite是当前最高效的开发工具？
- 在开发效率上，Vite 能将项目的启动性能提升一个量级，并且达到毫秒级的瞬间热更新效果
- 在模块化方面，Vite 基于浏览器原生 ESM 的支持实现模块加载，并且无论是开发环境还是生产环境，都可以将其他格式的产物(如 CommonJS)转换为 ESM
- 在语法转译方面，Vite 内置了对 TypeScript、JSX、Sass 等高级语法的支持，也能够加载各种各样的静态资源，如图片、Worker 等等
- 在产物质量方面，Vite 基于成熟的打包工具 Rollup 实现生产环境打包，同时可以配合Terser 、 Babel 等工具链，可以极大程度保证构建产物的质量
