这是我参与「第五届青训营」伴学笔记创作活动的第14天，今天学习vite相关知识
Vite是Vue的作者尤雨溪开发的Web开发构建工具，它是一个基于浏览器原生ES模块导入的开发服务器。
在开发环境下，利用浏览器去解析import，在服务器端按需编译返回，完全跳过了打包这个概念，服务器随启随用。同时不仅对Vue文件提供了支持，还支持热更新，而且热更新的速度不会随着模块增多而变慢。在生产环境下使用Rollup打包。
vite是面向现代浏览器的一个更轻、更快的web应用开发工具，基于ECMASCript标准原生模块系统(ES Modules)实现。
在浏览器端使用 export、import 的方式导入和导出模块，在 script 标签里设置 type="module" （ ES Modules 目前主流的浏览器都已经支持） Vite 要求项目完全由 ES Module 模块组成，common.js 模块不能直接在 Vite 上使用
vite的由来： 如果应用比较复杂，使用webpack开发过程相对没那么丝滑
- 使用webpack Dev Server冷启动时间会比较长
- 使用webpack HMR热更新的反应速度比较慢
Vite具有以下特点：
- 快速的冷启动
- 即时热模块更新（HMR，Hot Module Replacement）
- 真正按需编译
- Vite是在推出Vue 3的时候开发的，目前仅支持Vue 3.x，这意味着与Vue 3不兼容的库也不能与Vite一起使用。
- 开箱即用，避免各种Loader和Plugin的配置
vite快速上手
vite官方提供了一个比较简单的脚手架：create-vite-app，可以使用这个脚手架快速创建基于Vite的vue.js应用
npm init vite-app 项目名字
cd 项目
npm install
npm run dev
yarn create vite-app 项目名字
cd 项目
yarn
yarn dev
vite VS webpack
serve : 启动一个用于开发的服务器
build : 构建整个项目(上线)
当我们执行vite serve的时候，我们发现响应速度非常快，几乎是秒开，对比vue-cli有明显的差别，因为Webpack Dev Server启动时，需要先build一遍，而build的过程是需要消耗很多时间。
vite的未来
由于 Vite 使用了 JavaScript 模块，所以最好让依赖关系也使用 JavaScript 模块。虽然大多数现代 JS 包都提供了这一点，但一些老的包可能只提供 CommonJS 模块。
Vite 可以将 CommonJS 转换为 JavaSript 模块，但在一些边缘情况下它可能无法做到。当然，它还需要支持 JavaScript 模块的浏览器。
与 Webpack/Vue CLI 不同，Vite 无法创建针对旧版浏览器、web components 等的捆绑包。
而且，与 Vue CLI 不同，开发服务器和构建工具是不同的系统，导致在生产与开发中可能出现不一致的行为。
