学习目标

在这里，你将系统学习了解 Ant Design Pro 脚手架的相关知识

我们将以最简单直接的方式为您呈现内容！

以下仅为我在开发过程中的个人经验总结，尚不能作为规范的教学材料。由于我主要负责 Java 后端的开发，对于前端框架的运用并不十分熟悉，因此在某些描述中可能显得不够专业。

🍚 简介

想要深入学习Ant Design Pro脚手架，可以跳转至官网学习：

🍗 官网地址：开始使用 - Ant Design Pro (opens new window)

当然，在使用 Ant Design Vue、Ant Design Pro和Vite 等前端框架的过程中，我也积累了诸多经验技巧和踩坑经历，这些内容均记录在了我的个人博客当中。

有兴趣的朋友，可以点击此处跳转学习：前端框架踩坑与技巧总结：Ant Design、Vite，助您无忧编程 (opens new window)，希望对您的学习有帮助！

🍜 快速搭建

注意

确保本地 Node.js 环境配置完成，版本为 v18.x.x及以上

• 使用 npm 全局安装 pro-cli 构建工具（脚手架）：

npm i @ant-design/pro-cli -g

• 使用脚手架，在指定目录下快速搭建前端框架：

pro create memory-api

• 项目下安装 yarn 包管理工具：

yarn -V

• 至此，前端项目框架搭建完成，执行以下命令，启动项目：

yarn run start

🥩 Ant Design 组件库

• Ant Design 组件库是一个卓越的 UI 组件库，其下的组件设计美观且功能强大，大大提升了我开发工作的效率。下面我将详细介绍一些我在日常开发中频繁使用到的 Ant Design 组件。