发布于 2023.06.06（芒种）

Ant Design 是蚂蚁集团对外开源的一套 UI 设计，官方有针对这套设计的 React  实现，即 Ant Design of React，也就是我们熟知的 antd，主要用于研发企业级中后台产品，社区也有一些基于其他框架的实现。

官网地址：https://ant.design/docs/react/introduce-cn

创建样板项目

官方没有这块例子，自己搭建！

先创建一个样板项目（采用 Vite React TS 模板）：

注意：为了更快的安装速度，我使用了 yarn 这个包管理器，没有安装的话可以通过 npm install -g yarn指令安装。

按照上述指示进入项目目录，安装依赖，启动开发环境。

安装 antd 依赖

执行指令：yarn add antd。

引入 antd

修改 App.tsx 文件，改成下面这样：

<DatePicker> 的 onChange 事件提供的是 dayjs.Dayjs 类型，我这里没有引入，为了避免 TS 报错，我从 DatePickerProps['onChange'] 中解析出了类型用作事件处理器参数的类型声明。

不过最好还是使用 dayjs 依赖比较好。

引入 dayjs

效果：

引入 Alert 组件

效果：