Skip to content

wonyun/ant-design

 
 

Repository files navigation

Ant Design

Coveralls 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.

中文 README

Features

  • An enterprise-class UI design language for web applications.
  • A set of high-quality React components out of the box.
  • Written in TypeScript with complete define types.
  • A npm + webpack + dva front-end development workflow.

Let's build a better antd together PRs Welcome

antd is an open source project, improvements are welcomed. If you are interested in contributing to antd, you can watch this repository, join in discussion, or try to implement some features which have been accepted. Actually, there are many ways to contribute.

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 or babel-loader option
    {
      "plugins": [
        ["import", { libraryName: "antd", style: "css" }] // `style: true` for less
      ]
    }

    Then you can import components from antd, equivalent to import manually below.

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

    import DatePicker from 'antd/lib/date-picker';  // for js
    import 'antd/lib/date-picker/style/css';        // for css
    // import 'antd/lib/date-picker/style';         // that will import less

Environment Support

  • Browser: Modern browsers and Internet Explorer 9+.

IE8 issues

TypeScript

tsconfig.json

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

Note: set allowSyntheticDefaultImports to prevent error TS1192: Module 'react' has no default export.

Links

Contributing

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

About

🐜 One design language

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • CSS 42.1%
  • TypeScript 39.7%
  • JavaScript 17.7%
  • Other 0.5%