ui框架-antd的使用

在antd的官网里面给我们提供了几个不同的布局，在组件里可以找到；
下载引入 npm install antd
去官网复制粘贴复制一个button按钮看看是否可以在本页面显示出来（这个时候是全局引入的，如果使用成功以后则进行按需引入）；
引入全部的样式文件 index.js
import ‘antd/dist/antd.css’
import {Button} from antd

全局引入：引入全部的样式文件在index.js里面 import ‘antd/dist/antd.css’；会导致包大

按需引入：选要babel-plugin-import插件，是先按需引入；
可以去npm官网看看怎么使用
``
下载安装 npm install babel-plugin-import
修改webpack.config.js 找 babel-loader ->plugins 第一个babel-loader有这一项；
babel-loader
“plugins”: [
…,
[“import”, {‘libraryName’:‘antd’,style:true}] //把这一句放在plugins的最后；
]
这时候可能会遇到问题：项目启动不起来原因可能是：antd的less版本2.7.3和我们安装的less版本3.1.1冲突了
将less的版本回退到2.7.3
将index.js 里的全局样式文件删除

安装完成以后，他的按需引入是会自动带入响应的css文件，所以你去index.js里面把全局引入的那句给注释掉看看是否可以用；