React 图标大小很大

Question

我在我的网站中使用 React Icons，我注意到该包相当大 - 在开发人员工具的网络选项卡中几乎有 9MB（这使得网站在慢速互联网上加载需要很长时间）。然而，我最多只使用几个图标。以下是我目前在代码中导入图标的方式：

import { AiFillCloseCircle, AiOutlineMenu } from 'react-icons/ai';

我尝试在网上寻找解决方案，但我找不到任何关于如何在仅使用几个图标时减少 React Icons 文件大小的明确答案。

任何人都可以建议以更有效的方式使用 React Icons 的解决方案或最佳实践吗？我想在不影响功能的情况下尽可能减小包的大小。

提前致谢！

Answer 1

你应该像这样导入它们。

import FaFacebookSquare from 'react-icons/lib/fa/facebook-square';
import FaLinkedin from 'react-icons/lib/fa/linkedin';
import FaTwitter from 'react-icons/lib/fa/twitter';
import FaPinterest from 'react-icons/lib/fa/pinterest-square';
import FaInstagram from 'react-icons/lib/fa/instagram';