使用命令引入UI组件库 npm install antd --save

使用命令安装ant的图标库 npm install --save @ant-design/icons ，注意这里的@后面是一个ant没有单词d!

配置Antd Design样式按需自动引入

npm install vite-plugin-style-import@1.4.1 -D使用该命令导入插件自动引入组件的样式，不用自己在写引入css样式，并且现在的版本antd里面也没有这个css样式文件了。

然后在vite.config.ts中进行配置：

plugins: [
    react(),
    styleImport({
      resolves: [
        AntdResolve()
      ]
    }),
  ],

直接引入使用：

界面展示：