- 前端工程的痛点
-模块化：尽管现在有了三个主要和常用的业界规范（ESM、 CommonJS、UMD）, 但是还没有形成一个统一。所以模块化在前端工程还是存在问题。
-资源编译：浏览器的标准赶不上前端高级语法的编译。
-产物质量：代码体积（需要压缩，删除线上代码），产物语法的兼容性存在问题。
-开发效率：改动代码后，需要构建工具才能立刻看到最新的页面效果。
- 前端构建工具的意义
-模块化方案：
（1）提供模块加载方案。
（2）兼容不同模块规范。
-语法转译：
（1）高级语法转译，如 Sass、TypeScript。
（2）资源加载，如图片、字体、worker。
-产物质量：代物压缩、无用代码删除、语法降级。
-开发效率：热更新。
- Vite 概览
定位：新一代前端构建工具。
两大组成部分: （1）No-bundle开发服务，源文件无需打包。 （2）生产环境基于Rollup的Bundler。
核心特征：（1）高性能，dev启动速度和热更新速度非常快。（2）简单易用，开发者体验好。
- Vite 优势
（1）速度快
Webpack 启动后会做一堆事情，经历一条很长的编译打包链条，从入口开始需要逐步经历语法解析、依赖收集、代码转译、打包合并、代码优化，最终将高版本的、离散的源码编译打包成低版本、高兼容性的产物代码。而 Vite 运行 Dev 命令后只做了两件事情，一是启动了一个用于承载资源服务的 service；二是使用 esbuild 预构建 npm 依赖包。之后就一直躺着，直到浏览器以 http 方式发来 ESM 规范的模块请求时，Vite 才开始“按需编译”被请求的模块。
（2）生态
Vite 对已有生态的兼容性也不容忽略，主要体现在两个点：
- 与 Vue 解耦，兼容支持 React、Svelte、Preact、Vanilla 等，这意味着 Vite 可以被应用在大多数现代技术栈中。
- 与 Rollup 极其接近的插件接口，这意味着可以复用 Rollup 生态中大部分已经被反复锤炼的工具。
