CSS- one bundle for all styles or distributed among modules? about modern-guide-to-packaging-js-library

[frehner]

Current rough draft:

### Split your CSS files

<details>
<summary>Enable devs to only include the CSS they need</summary>

If you are creating a CSS library (like Bootstrap, Tailwind, etc.), it may be easier to provide a single CSS bundle that includes all the functionality that your library provides. However, even in that situation, your CSS bundle may end up becoming large enough that it affects the performance of the devs' sites. In such cases, these libraries generally provide methods of generating a CSS bundle that only includes the necessary CSS for what the developer is using (see how [Bootstrap](https://getbootstrap.com/docs/5.2/customize/optimize/) and [Tailwind](https://tailwindcss.com/docs/optimizing-for-production) do it.)

A similar option is to do what [react-component](https://github.com/react-component/slider#usage) does, where you separate out your CSS into individual bundles per component that are imported when the corresponding component is used.

</details>