create-react-app之使用antd配置方法

1.创建app

create-react-app antd-demo

2.下载antd

 yarn add antd

3.下载 react-app-rewired

yarn add react-app-rewired

4.配置package.json

/* package.json */
"scripts": {
-   "start": "react-scripts start",
+   "start": "react-app-rewired start",
-   "build": "react-scripts build",
+   "build": "react-app-rewired build",
-   "test": "react-scripts test --env=jsdom",
+   "test": "react-app-rewired test --env=jsdom",
}

5.在项目根目录创建一个 config-overrides.js 用于修改默认配置。

6.下载 babel-plugin-import

yarn add babel-plugin-import

7.在config-override.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;
  };

8.导入组件

 import { Button } from 'antd';

 

转载于:https://my.oschina.net/u/3937325/blog/1933910