ant-design/docs/react/introduce.zh-CN.md
2024-08-02 22:47:57 +08:00

8.1 KiB
Raw Blame History

order title
0 Ant Design of React

antd 是基于 Ant Design 设计体系的 React UI 组件库,主要用于研发企业级中后台产品。

+

特性

  • 🌈 提炼自企业级中后台产品的交互语言和视觉风格。
  • 📦 开箱即用的高质量 React 组件。
  • 🛡 使用 TypeScript 开发,提供完整的类型定义文件。
  • ⚙️ 全链路开发和设计工具体系。
  • 🌍 数十个国际化语言支持。
  • 🎨 深入每个细节的主题定制能力。

兼容环境

  • 现代浏览器
  • 支持服务端渲染。
  • Electron
Edge
Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
Opera
Opera
Electron
Electron
Edge last 2 versions last 2 versions last 2 versions last 2 versions last 2 versions

对于 IE 系列浏览器,需要提供相应的 Polyfill 支持,建议使用 @babel/preset-env 来解决浏览器兼容问题。如果你在使用 umi,可以直接使用 targets 配置。

antd@2.0 之后不再支持 IE8。 antd@4.0 之后不再支持 React 15 和 IE9/10。 antd@5.0 之后不再支持 IE。

版本

  • 稳定版:npm package

你可以订阅:https://github.com/ant-design/ant-design/releases.atom 来获得版本发布的通知。

安装

使用 npm 或 yarn 或 pnpm 或 bun 安装

我们推荐使用 npmyarnpnpmbun 的方式进行开发,不仅可在开发环境轻松调试,也可放心地在生产环境打包部署使用,享受整个生态圈和工具链带来的诸多好处。

如果你的网络环境不佳,推荐使用 cnpm

浏览器引入

在浏览器中使用 scriptlink 标签直接引入文件,并使用全局变量 antd

我们在 npm 发布包内的 dist 目录下提供了 antd.jsantd.min.jsreset.css。你也可以通过 CDNJSUNPKG 进行下载。

强烈不推荐使用已构建文件,这样无法按需加载,而且难以获得底层依赖模块的 bug 快速修复支持。

注意:antd.jsantd.min.js 依赖 reactreact-domdayjs,请确保提前引入这些文件。

示例

import React from 'react';
import { DatePicker } from 'antd';

const App = () => {
  return <DatePicker />;
};

export default App;

按需加载

antd 默认支持基于 ES modules 的 tree shaking。

TypeScript

antd 使用 TypeScript 进行书写并提供了完整的定义文件(不要引用 @types/antd)。

链接

非 React 的实现

我们采用 React 封装了一套 Ant Design 的组件库,其他语言的 UI 实现可以参考此处

谁在使用

Ant Design 广泛用于国内外的企业级网站搭建,可以查看 wappalyzer 作为参考数据。如果你的公司和产品使用了 Ant Design欢迎到 这里 留言。

如何贡献

在任何形式的参与前,请先阅读 贡献者文档。如果你希望参与贡献,欢迎提交 Pull Request,或给我们 报告 Bug

强烈推荐阅读 《提问的智慧》《如何向开源社区提问题》《如何有效地报告 Bug》《如何向开源项目提交无法解答的问题》,更好的问题更容易获得帮助。

社区互助

如果您在使用的过程中碰到问题,可以通过下面几个途径寻求帮助,同时我们也鼓励资深用户通过下面的途径给新人提供帮助。

通过 GitHub Discussions 提问时,建议使用 Q&A 标签。

通过 Stack Overflow 或者 Segment Fault 提问时,建议加上 antd 标签。

  1. GitHub Discussions
  2. Stack Overflow (English)
  3. Segment Fault(中文)