Vite2.0版本发布，有哪些新特性？什么是ViteVite（法语意思是“快”，读作/vit/，类似veet）是一个全新的前端构建工具，你可以理解为开箱即用的开发服务器+打包工具的组合，但更轻更快。Vite利用浏览器原生ES模块支持和编译为原生语言的开发工具（如esbuild）来提供快速和现代的开发体验。Vite由两个主要部分组成：一个开发服务器，通过原生ES模块提供源文件，具有丰富的内置功能和惊人的快速热模块替换（HMR）。一个将代码与Rollup捆绑在一起的构建命令，它被预先配置为输出高度优化的生产静态资产。此外，Vite通过其插件API和JavaScriptAPI具有高度可扩展性，并提供全面的类型支持。Vite有多快？在Repl.it上从头开始一个基于Vite的React应用程序。当浏览器页面加载时，CRA（create-react-app）甚至还没有安装依赖项。如果你还没有听说过Vite是什么，你可以了解一下这个项目的初衷。Vite2.0新特性与去年发布的1.0版本相比，Vite2.0可以说是第一个稳定版本。该版本带来了许多重大改进。多框架支持Vite一开始主要侧重于Vue对单文件组件的支持，但是2.0在以往经验的基础上提供了更加稳定灵活的内部架构，使其可以通过插件机制全面支持任何框架。现在Vite提供了官方的Vue、React、Preact、LitElement项目模板，Svelte社区也在开发Vite集成方案。新的插件机制和APIVite2.0的灵感来自WMR，基于Rollup插件API进行设计。许多Rollup插件直接兼容Vite。插件除了使用Rollup插件钩子外，还可以使用一些额外的Vite特定API来处理一些打包不存在的需求，比如区分开发和打包，或者自定义热更新处理。此外，Vite的JSAPI也得到了很大的改进——很多用户已经在开发基于Vite的上层框架，Nuxt团队也在Nuxt3中验证了初步集成的可行性。基于esbuild的依赖预打包由于Vite是原生的ESM基于开发服务器，我们需要在启动时通过依赖预打包来实现两个目标：1.减少模块/请求的数量；2.支持CommonJS依赖。预打包只需要在依赖发生变化的时候执行，但是在依赖比较多的项目中，每次执行可能还是需要很长时间。Vite之前使用Rollup来执行这个过程。在2.0中，我们改用了esbuild，这将流程提速了数十倍。冷启动一个项目，以前需要将近30秒来预打包，现在只需要不到两秒！从webpack或其他捆绑器迁移到Vite应该会看到类似的速度改进。作为参考，我们可以使用ReactMaterial项目进行验证。更好的CSS支持Vite将CSS视为模块的第一类，支持以下开箱即用的功能：增强的路径解析：CSS中的@import和url()路径由Vite的路径解析器解析，支持别名和npm依赖项。自动URL重写：所有url()路径都会自动重写，以确保它们在开发和构建中都指向正确的文件路径。CSS代码拆分：构建时，每个拆分的JS文件会自动生成对应的CSS文件，两个文件会按需自动并行加载。服务端渲染（SSR）支持Vite提供灵活的API直接在Node.js中高效加载ESM源代码（也有无需打包的准确更新），并自动外部化commonjs兼容依赖以提高开发和SSR构建速度。在生产环境中，服务端可以和Vite完全解耦，基于ViteSSR的架构也可以很方便的用于静态预渲染（SSG）。旧版浏览器支持Vite默认只支持原生支持ESM的现代浏览器，但旧版浏览器可以通过官方@vitejs/plugin-legacy支持。legacyplugin会自动为旧浏览器生成附加包，并在html中根据浏览器的ESM支持情况插入代码选择性加载相应的包（类似于vue-cli的现代模式）。参考：从Vite1.0迁移到Vite2.0的说明
