@source Not Working as Expected During Build Process

[mafifi]

What version of Tailwind CSS are you using?

For example: v4.1.3

What build tool (or framework if it abstracts the build tool) are you using?

Vite 6.2.5

What version of Node.js are you using?

v20.18.1

What browser are you using?

Edge 135.0.3179.54

What operating system are you using?

mac OS 15.4

Reproduction URL

https://github.com/mafifi/monorepo

Describe your issue

Try running laifu-nini in preview, this will look visually correct. Edit the app.css file inside laifu-nini and edit

@source '../../../packages/ui/src/lib/components/ui/button/*.svelte';

to

@source '../../../packages/ui/src/lib/components/ui/*/*.svelte';

This will break visually.

There appears to be an inherit limit on the number of files / directories, @source will accept.

[mafifi]

Trying to debug this to identify where the issue is in tailwind.

Much easier to reproduce with the cli.

cd apps/laifu-nini && npx @tailwindcss/cli --input src/app.css --optimize | grep oklch

This will work, and include the classes that are needed by shadcn in the packages/ui

cd apps/laifu-nini && npx @tailwindcss/cli --input src/app.css --cwd ../../packages/ui --optimize | grep oklch

This will not work, and shake out classes that are used!

So it looks @source is working, but somehow --optimize doesn't respect it?

[Roene-JustBetter]

I have the same issue. When I add this in my app.css: @source "../../vendor/rapidez/account/resources/views/account/**/*.blade.php"; Everything works fine.

When I change it to this: @source "../../vendor/rapidez/*/resources/views/account/**/*.blade.php"; The styling doesn't work.

[hamidrezahanafi]

I have the similar issue with tailwind @source and a large codebase but only when using Turbopack, it's not happening with Webpack, In my case it just hang in Compiling ... I enabled DEBUG=1 and it got stuck in following section

[hamidrezahanafi]

I could reproduce it with Turbopack and NextJS in a vanilla app Created the issue on NextJS repo, please upvote if you have similar issue https://github.com/vercel/next.js/issues/78407

[wongjn]

Trying to debug this to identify where the issue is in tailwind.

Much easier to reproduce with the cli.

cd apps/laifu-nini && npx @tailwindcss/cli --input src/app.css --optimize | grep oklch

This will work, and include the classes that are needed by shadcn in the packages/ui

cd apps/laifu-nini && npx @tailwindcss/cli --input src/app.css --cwd ../../packages/ui --optimize | grep oklch

This will not work, and shake out classes that are used!

So it looks @source is working, but somehow --optimize doesn't respect it?

A slight misnomer here. With the --cwd flag, the --input file path will be relative to --cwd:

https://github.com/tailwindlabs/tailwindcss/blob/231cdddb941190da065637d2861d82ba3866194c/packages/%40tailwindcss-cli/src/commands/build/index.ts#L73

https://github.com/tailwindlabs/tailwindcss/blob/231cdddb941190da065637d2861d82ba3866194c/packages/%40tailwindcss-cli/src/commands/build/index.ts#L86

So the CLI would end up using packages/ui/src/app.css as the input path with --input src/app.css --cwd ../../packages/ui, whereas --input src/app.css would use apps/laifu-nini/src/app.css.