### 总结一下使用阿里的antd这个ui框架的正确姿势(官网推荐的按需加载方式)
1. 本文针对在现有项目中引入antd
2. 二话不说: npm install antd --save
3. 在.babelrc文件中加入:
{
"plugins": [
["import", { "libraryName": "antd", "style": "css" }]
]
}
如果.babelrc文件已有其他的plugins，那就将["import",
{ "libraryName": "antd", "style": "css" }]这段放到plugins数
组里。
4. 执行: npm install babel-plugin-import --save-dev
.babelrc文件中import是需要安装babel-plugin-import插件的。
5. 使用:
import { DatePicker } from 'antd';
ReactDOM.render(<DatePicker />, mountNode);
PS:按需加载方式只需从 antd 引入模块即可，无需单独引入样式
6. 问题:
如果有样式无效的情况,可能是webpack.production.config.js文件中:
module: {
loaders: [
{test: /\.css$/, exclude: /node_modules/, loader:
ExtractTextPlugin.extract('style', 'css!postcss')},
]
}
包含了exclude: /node_modules/，这样会排除node_modules文件夹下的样式，去掉exclude: /node_modules/再试试。
