Vite是什么？怎么用Vite来创建一个前端项目?

介绍

Vite是一种新型的前端构建工具，能够显著提升前端开发体验，主要有以下特点：

• 使用原生ESM文件，无需打包
• 轻量快速的热加载
• 优化构建，可选单页应用或者库模式，配置构建
• 灵活的API

常用框架项目模板

搭建第一个Vite项目，我这里使用NPM搭建，可选的有Yarn，pnpm。跟Vue类似，Vite也提供了很多的模板，用来创建不同框架的项目。目前支持的模板有：

1. vanlilla,vanlilla-ts
2. vue,vue-ts
3. react,react-ts
4. preact,preact-ts
5. lit,lit-ts
6. svelte,svelte-ts

可以根据需要选择，带-ts的是TypeScript版本，没有的话就用的是JavaScript。

搭建项目

# template可以根据上面罗列的来选择不同的模板
npm create vite@latest my-app --template vue

 根据提示，运行以下命令：

#进入到新建的项目根目录下
cd my-app
#安装依赖
npm install
#本地运行 
npm run dev

 在浏览器中打开上面的URL就表示成功的用Vite创建了一个新的项目。

Vite作为新的打包工具，能实现打包后比Webpack打包后更快速的访问。这个算是它的优势之一。

参考：https://cn.vitejs.dev/guide/