/ant-design

:ant: One design language

Primary LanguageCSSMIT LicenseMIT

Ant Design

Coverage Status Dependency Status

npm package NPM downloads Average time to resolve an issue Join the chat at https://gitter.im/ant-design/ant-design

An enterprise-class UI design language and React-based implementation.

Features

  • An enterprise-class design language and high quality UI.
  • Graceful UI components out of the box, base on React Component.
  • Written in TypeScript with complete define types.
  • A npm + webpack + babel + dora + dva development framework.

Let's build a better antd together

antd is an open source project, any reasonable improvement is welcomed. If you are interested in contributing to antd, you can watch this repository and join in discussion, or try to implement some features which had been accepted.

Install

npm install antd

Usage

Use prebuilt bundle

import { DatePicker } from 'antd';
ReactDOM.render(<DatePicker />, mountNode);

And import style manually:

import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'

Use modularized antd

  • Use babel-plugin-import (Recommended)

    // .babelrc
    {
      "plugins": [["import", { libraryName: "antd", style: "css" }]]
    }

    Then you can import components from antd directly.

    // import js and css modularly, parsed by babel-plugin-import
    import { DatePicker } from 'antd';
  • Manually import

    import DatePicker from 'antd/lib/date-picker';  // just for js
    import 'antd/lib/date-picker/style/css';  // with style

Browser Support

Normal browsers and Internet Explorer 9+.

IE8 issues

TypeScript

tsconfig.json

{
  "compilerOptions": {
    "moduleResolution": "node",
    "jsx": "preserve",
    "allowSyntheticDefaultImports": true
  }
}

Links

Contributing

We welcome all contributions, please read our CONTRIBUTING.md first. You can submit any ideas as pull requests or as a GitHub issue. If you'd like to improve code, check out the Development Instruction and have a good time! :)