【Python百日进阶-Web开发-Vue3】Day542 - Vue3 商城后台 02：Windi CSS 与 Vue Router4

一、WindiCSS 初始

1.1 WindiCSS 是什么？

Windi CSS 是下一代工具优先的 CSS 框架。
如果你已经熟悉了 Tailwind CSS，可以把 Windi CSS 看作是按需供应的 Tailwind 替代方案，它为你提供了更快的加载体验，完美兼容 Tailwind v2.0，并且拥有很多额外的酷炫功能。

1.2 为什么选择 Windi CSS？

当项目越来越大时（大约几十个组件），使用 Tailwind CSS 最初的编译时间达到了 3s，而热更新时的时间甚至超过了 1s。 - @voorjaar

通过扫描 HTML 和 CSS 按需生成工具类（utilities），Windi CSS 致力于在开发中提供 更快的加载体验 以及更快的 HMR，并且在生产环境下无需对 CSS 进行 Purge（一种在生产环境中对未使用的 CSS 进行清除而节省体积的技术）。

1.3. 基础用法

Windi CSS 支持 Tailwind CSS 的所有 工具类，无需任何额外配置。

你可以像平常一样正常编写你的组件，同时在