01浅谈构建工具
模块化方案 1.提供模块加载方案 2.兼容不同模块规范 语法转译 1.高级语法转译，如 Sass、TypeScript 2.资源加载，如图片、字体、worker 产物质量 产物压缩、无用代码删除.语法降级 开发效率 热更新
02 Vite概要介绍
1.定位:新一代前端构建工具 两大组成部分 1.No-bundle 开发服务，源文件无需打包 2.生产环境基于 Rollup 的 Bundler
核心特征 1.高性能，dev 启动速度和热更新速度非常快 2.简单易用，开发者体验好
2.当下其他架构问题： 瓶颈在哪里? bundle（打包）带来的性能开销 JavaScript 语言的性能瓶
3.vite基于原生ESM的开发服务优势 无需打包项目源代码 天然的按需加载 可以利用文件级的浏览器缓存
03Vite 上手实战
生产环境 Tree Shaking 优化原理 1基于ESM的import/export 语句依赖关系，与运行时状态无关 2.在构建阶段将未使用到的代码进行删除
04 vite
1.前端构建工具 vite是下一代前端开发与构建工具。 Vite意在提供开箱即用的配置.同时它的插件[API]和JavaScript API 带来了高度的[可扩展性]，并有完整的类型支持。 2.组成 一个开发服务器，它基于原生[ES]模块 提供了丰富的内建功能，速度快模块[热更新]（HMR）。
一套构建指令，它使用Rollup打包代码，并且它是预配置的，可输出用于[生产环境]的高度优化过的静态资源。 3.优势
01 快速的开发体验
Vite 的构建速度非常快，由于采用了浏览器原生的模块化系统，因此可以避免传统构建工具的静态打包和编译，从而提高了开发效率和构建速度。同时，Vite 还支持 Hot Module Replacement（HMR）和快速刷新等功能，可以实时更新代码和预览修改效果，让开发者专注于开发过程中的实际需求。
02 简单易用的配置
Vite 的配置非常简单易用，通常只需要一个配置文件即可完成项目的构建和部署。Vite 的配置文件是一个 JavaScript 模块，允许开发者自定义构建和部署的方式，同时也提供了一些默认配置选项，如端口号、代理、压缩等。
03 支持多种前端框架和语言
Vite 不仅支持常见的前端框架如 Vue、React 和 Angular 等，还支持多种前端语言，如 TypeScript、CoffeeScript 和 Sass 等。这使得开发者可以更加灵活地选择自己熟悉的技术栈，并且能够快速地集成各种框架和语言，提高了开发效率和代码质量
