Antd介绍与使用

[bai3]

Ant Design of React

Antd是基于React实现，蚂蚁的开源项目

支持环境

• 现代浏览器和IE9及以上
• 支持服务端渲染
• Electron

安装

cnpm安装，其他类似

$ cnpm install antd --save

浏览器引入

在浏览器中使用script和link标签直接引入文件，并使用全局变量antd

示例

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

引入样式

import 'antd/dist/antd.css'

按需加载

• 使用babel-plugin-import

  {
      "plugins":[
          [
             "import",{"libraryName":"antd","libraryDiretory": "es","style","css"}
          ]
       ]
  }

  然后只需从antd引入模块即可，无需单独引入样式。等同于下面手动引入的方式。

  import { DatePicker } from 'antd'

• 手动引入

  import DatePicker from 'antd/lib/date-picker'
  import 'antd/lib/date-picker/style'

  ​