react中使用AntDesign库 --- babel-plugin-import 配置

react项目中引用AntDesign组件库时，在运行项目报一下警告：
You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.

这是因为在使用ant组件库时：使用了

import { Button } from 'antd';

的写法引入了 antd 下所有的模块，这会影响应用的网络性能；
使用 babel-plugin-import 来进行按需加载：

• 执行：npm i babel-plugin-import -D
  安装一个babel插件用于做组件的按需加载（否则项目会打包整个组件库，非常大）

• 根目录下新建.roadhogrc文件（别忘了前面的点，这是roadhog工具的配置文件，下面的代码用于加载上一个命令安装的import插件），写入：

{
  "extraBabelPlugins": [
    ["import", {
      "libraryName": "antd",
      "libraryDirectory": "lib",
      "style": "css"
    }]
  ]
}