svelte-package + Tailwind CSS: where to import base CSS and get utility classes in the consuming app?

[OmidNejadabbasi]

Describe the bug

I have a monorepo with two packages: a main app and a component library created with library mode in the Svelte CLI (npx sv create). The library uses Tailwind. When I import the library in the main app, its Tailwind utility classes are not generated.

• I can't import base CSS in src/routes because this is a library, not an app.

• Importing it in src/lib/index.ts doesn't work: app.css lives in src/, outside src/lib, and svelte-package only processes src/lib, so the import path breaks in the built output.

• The packaging docs mention sideEffects: ["**/*.css"] but don't explain where to import base CSS or how to make Tailwind classes from the library work in the consuming app.

Is there a recommended way to include base CSS in a svelte-package library and have its Tailwind classes generated when the library is used in another app?
In the reproduction example TestButton component has some tailwind classess(e.g. bg-blue-500). How should we include that in the final bundle that svelte-package generates?

Reproduction

Here is a minimal reproduction example: https://github.com/OmidNejadabbasi/sveltekit-lib-with-tw
I have added any code for applying tailwind. I want you to tell me what is the best way to solve problem explained in the repo README.md.

[OmidNejadabbasi]

It seems flowbite-svelte package does it by adding its components code to the cosumer app's css file:
Link: Flowbite configuratoin

If your CSS file is at src/app.css:

@import "tailwindcss";
@plugin 'flowbite/plugin';
@custom-variant dark (&:where(.dark, .dark *));
/* ... */
@source "../node_modules/flowbite-svelte/dist";
@source "../node_modules/flowbite-svelte-icons/dist";

But it feels really hacky to me.

[sirkostya009]

@import 'tailwindcss';
@plugin "flowbite/plugin";
@source "../node_modules/flowbite-svelte";
@source "../node_modules/flowbite-svelte-icons";

We, however, do use a an out-of-date flowbite-svelte library (0.46) so I am not sure if its the right thing for newer ones, and its not really hacky, you're explicitly telling Tailwind to source those files for generating CSS utilities.