Vue3 + Vite + Ant design vue + Windi CSS

 1、新建项目

npm init vue@latest

在本地搭建 Vue 单页应用。创建的项目将使用基于Vite的构建设置，并允许我们使用 Vue 的单文件组件(SFC)。

Vite 官网：https://vitejs.cn
Vite 是一个 web 开发构建工具，由于其原生 ES 模块导入方法，它允许快速提供代码。

这一指令将会安装并执行 create-vue，它是 Vue 官方的项目脚手架工具。你将会看到一些诸如 TypeScript 和测试支持之类的可选功能提示：

2、使用 Windi CSS

Windi CSS 的设计灵感来源于 Tailwindcss，而 Windi CSS 比 Tailwindcss 有更快的加载体验。

Windi CSS 是一款提供功能类的 CSS 框架，最直观的特点就是，你的 CSS 不用离开 HTML 就能够使样式生效，即在 Vue 文件里面，你将不再需要写 style 标签来装载你的 CSS，而是通过 class 工具类，或者「自定义前缀 + 属性模式」来控制 CSS 样式的效果，这些 class 工具类或者属性模式都是 Windi CSS 内部现成的，或者是通过 Windi CSS 配置文件配置的。

npm i vite-plugin-windicss -D

3、配置

vite.config.js

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import v