快速上手

这是一个最简单的 Ant Design 组件的在线 codesandbox 演示。

访问 创建一个 codesandbox 的在线示例，别忘了保存以创建一个新的实例。

直接用下面的代码替换 的内容，用 React 的方式直接使用 antd 组件。

你可以在组件页面的左侧菜单查看组件列表，比如 Alert 组件，组件文档中提供了各类演示，最下方有组件 API 文档可以查阅。在代码演示部分找到第一个例子，点击右下角的图标展开代码。

然后依照演示代码的写法，在之前的 codesandbox 里修改 index.js，首先在 内引入 Alert 组件：

选择一个日期，在右侧预览区就可以看到如图的效果。

好的，现在你已经会使用基本的 antd 组件了，你可以在这个例子中继续探索其他组件的用法。如果你遇到组件的 bug，也推荐建一个可重现的 codesandbox 来报告 bug。

实际项目开发中，你会需要构建、调试、代理、打包部署等一系列工程化的需求。您可以阅读后面的文档或者使用以下脚手架和范例：

• 更多脚手架可以查看 脚手架市场

默认支持基于 ES modules 的 tree shaking，对于 js 部分，直接引入 import { Button } from 'antd' 就会有按需加载的效果。

如果你在开发环境的控制台看到下面的提示，那么你可能还在使用 或者 tree shaking 失效，请升级或检查相关配置。

如果想自己维护工作流，我们推荐使用 进行构建和调试，可以使用 React 生态圈中的 各种脚手架 进行开发。

目前社区也有很多基于 antd 定制的 ，欢迎进行试用和贡献。