react 按需引入 antd@4+

不管是 Vue 还是 React，每次引入 UI 库的时候都会出现问题，头疼。。。

准备一个react项目

我这里的话使用react脚手架 create-react-app 直接生成的。

下载 antd

cnpm i antd -S

下载依赖包

cnpm i react-app-rewired babel-plugin-import -S

在根目录(与package.json同级)下创建一个 config-overrides.js 文件

把下面的代码复制进去

const { injectBabelPlugin } = require('react-app-rewired');

module.exports = function override(config, env) {
 config = injectBabelPlugin(
 		   ['import', { libraryName: 'antd', libraryDirectory: 'es', style: 'css' }],
    	   config,
  );
 return config;
 };

修改package.json 中的启动命令

 "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test --env=jsdom",
    "eject": "react-scripts eject"
  },

就把上面大括号里面的内容复制替换一下就行了。

大功告成！直接重启项目

然后你就会发现项目启动不了了，哈哈哈(ಥ_ಥ) 跑路吧~~~~
报错：

The "injectBabelPlugin" helper has been deprecated as of v2.0. You can use customize-cra plugins in replacement - https://github.com/arackaf/customize-cra#available-plugins

解决办法：
其实就是版本引发的问题，记得上次node-sass突然更新。。。我tm没注意，忙活了一个下午。。。。
cnpm i react-app-rewired@2.0.2-next.0
执行一下这条命令把版本降低下来就行了。

答案就在上面这块空白区域，欢迎刮取哦 (ಥ_ಥ)