如何在React中动态导入两个css框架？

import('bootstrap/dist/css/bootstrap.min.css');

import('antd/dist/antd.css');

import React from 'react';
import 'bootstrap/dist/css/bootstrap.min.css';

class MyComponent extends React.Component {
  render() {
    return (
      <div>
        <button className="btn btn-primary">Click me</button>
        <table className="table">
          <thead>
            <tr>
              <th>#</th>
              <th>First Name</th>
              <th>Last Name</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>John</td>
              <td>Doe</td>
            </tr>
            <tr>
              <td>2</td>
              <td>Jane</td>
              <td>Smith</td>
            </tr>
          </tbody>
        </table>
      </div>
    );
  }
}

export default MyComponent;

import React from 'react';
import 'antd/dist/antd.css';
import { Button, Form, Input } from 'antd';

class MyComponent extends React.Component {
  render() {
    return (
      <div>
        <Button type="primary">Click me</Button>
        <Form>
          <Form.Item label="Username">
            <Input />
          </Form.Item>
          <Form.Item label="Password">
            <Input.Password />
          </Form.Item>
        </Form>
      </div>
    );
  }
}

export default MyComponent;