这是我参与「第五届青训营 」伴学笔记创作活动的第14天。
今天学习的内容是vite知识体系，我将学习后的重点内容总结为以下几点：
1.什么是vite？
vite是基于esbuild与Rollup，依靠浏览器自身ESM编译功能， 实现极致开发体验的新一代构建工具。vite由两大组成部分，第一个是No-bundle开发服务，源文件无需打包，第二个是生产环境基于Rollup的Bundler。它的核心特征有高性能，dev启动速度和热更新速度非常快，而且简单易用，开发者体验好。
2.如何指定vite插件的执行顺序？
我们可以使用 enforce 修饰符来强制插件的位置:
- pre：在 Vite 核心插件之前调用该插件
- 默认：在 Vite 核心插件之后调用该插件
- post：在 Vite 构建插件之后调用该插件
3.vite的优势？
- 非常快。
- 高度集成，开箱即用。
- 基于ESM急速热更新，无需打包编译。
- 基于esbuild的依赖预处理，比Webpack等node编写的编译器快几个数量级。
- 兼容Rollup庞大的插件机制，插件开发更简洁。
- 不与Vue绑定，支持React等其他框架，独立的构建工具。
- 内置SSR支持。
- 天然支持TS。
4.vite的核心原理？
Vite其核心原理是利用浏览器现在已经支持ES6的import,碰见import就会发送一个HTTP请求去加载文件。Vite启动一个 connect 服务器拦截这些请求，并在后端进行相应的处理将项目中使用的文件通过简单的分解与整合，然后再以ESM格式返回返回给浏览器。整个过程中没有对文件进行打包编译。
5.vite热更新流程？
首先，创建一个websocket服务端和client文件，启动服务；
其次，通过chokidar监听文件变更；
再者，当代码变更后，服务端进行判断并推送到客户端；
最后，客户端根据推送的信息执行不同操作的更新。
