如何从 FontAwesome 导入图标并摇晃所有未使用的图标？

问：

我们当前的实现将所有图标加载到字体中 awesome ：library

import { library } from '@fortawesome/fontawesome-svg-core';
import { fas } from '@fortawesome/pro-solid-svg-icons';
import { far } from '@fortawesome/pro-regular-svg-icons';
import { fat } from '@fortawesome/pro-thin-svg-icons';
import { fad } from '@fortawesome/pro-duotone-svg-icons';

library.add(fas, far, fat, fad);

所以现在我们可以为我们的图标使用字符串文字

<FontAwesomeIcon
      {...props}
      icon={[
        icon.type,
        icon.name,
      ]}
    />

问题是，我们的捆绑包中的字体大小很大（大约 10mb）。

我尝试通过将图标的名称传递给组件来使用动态导入 https://fontawesome.com/docs/web/use-with/react/add-icons#dynamic-icon-importing，但由于 Babel 不支持此类宏，因此失败了。

我的问题是，在字体很棒的文档之后，导入图标并摇晃未使用的图标的最佳实践是什么？