react 动态引入antd

摘自antd 管网—总结

yarn create react-app antd-demo-ts --template typescript                            // 生成react 项目
npx create-react-app antd-demo-ts --typescript                                           //  等同上一条目录


yarn add react-app-rewired customize-cra                                            //一个对 create-react-app 进行自定义配置的社区解决方案

修改package.json

"scripts": {
   "start": "react-app-rewired start",
   "build": "react-app-rewired build",
   "test": "react-app-rewired test",
}

在package.json所在的目录 添加webpack 文件： config-overrides.js

 module.exports = override(
   fixBabelImports('import', {
     libraryName: 'antd',
     libraryDirectory: 'es',
     style: 'css',
   }),
 );

// 测试

// src/App.tsx
  import React, { Component } from 'react';
 import { Button } from 'antd';
  import './App.css';

  class App extends Component {
    render() {
      return (
        <div className="App">
          <Button type="primary">Button</Button>
        </div>
      );
    }
  }

  export default App;

npm run start 启动