构建React组件库：如何捆绑CSS和其他资产？

Question

所以我的理解是，当您分发一个React组件供他人使用时，您应该发布它的编译版本，而不是源代码，并期望最终用户将其集成到自己的构建过程中。

这听起来很合理，但是我不确定捆绑CSS和其他资产（例如图片）的最佳策略。

一种方法是内联，但是对于中等大小的内容，内联似乎不受欢迎。

另一种方法是将CSS和图像导入到从库中导入组件的文件中。然后，最终用户的应用程序的构建过程将处理其余部分。喜欢：

import CoolComponent from 'CoolReactLibrary';
import 'CoolReactLibrary/css/styles.css';
import 'CoolReactLibrary/images/logo.png';

...

这看起来很麻烦，而且如果我有一个像这样的小组件的组件库，那就更麻烦了

import PrimaryButton from 'CoolReactLibrary/buttons';
import 'CoolReactLibrary/buttons/primary-button/styles.css';

import Card from 'CoolReactLibrary/layout';
import 'CoolReactLibrary/layout/card/styles.css';

import VerticalMenu from 'CoolReactLibrary/menus';
import 'CoolReactLibrary/menus/vertical-navigation/styles.css';

我的选择是让最终用户执行此操作：

import PrimaryButton from 'CoolReactLibrary/buttons';
import Card from 'CoolReactLibrary/layout';
import VerticalMenu from 'CoolReactLibrary/menus';

那里的一切都可以正常工作。

有人为此找到一个干净的解决方案吗？