@source does not scan node_modules

[imaginario27]

What version of Tailwind CSS are you using?

4.1.13

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

Vite (nuxt 4.1.2)

What version of Node.js are you using?

v22.19.0

What browser are you using?

Brave

What operating system are you using?

Windows

Reproduction URL

Not available. Working locally.

Package structure

Describe your issue

Let me expose what I am trying to achieve.

I have a Nuxt base project on the one hand and on the other hand I have another Design System Nuxt project which works as a layer for the base project.

The Design system is created with Tailwind (4.1.13) and exported as a package.

This package is installed under node_modules. Everything works fine with the exception that Tailwind is unable to scan the node_modules folder using @source inside the main css file.

I have tried @source with a local layer (design system in a separate folder) and it works fine, Nevertheless, as soon as I try to use the node_module directory, it does not work, even if the Tailwind documentation (https://tailwindcss.com/docs/detecting-classes-in-source-files) explain you can do this.

So I guess this might be a bug.

Please, if you have another temporary solution to solve this issue, please let me know.

[RobinMalfait]

Hey!

Can you share a minimal reproduction so we can take a look? @source should work when you point to node_modules/your-package as long as files inside the package are not gitignored.

That said, the better solution is to expose an index.css file from the other package that contains the necessary @source directives. That way the package is in charge of knowing where certain files are.

You can use exports with style and point it to a CSS file. Here is an example of our own tailwindcss package:

tailwindcss/packages/tailwindcss/package.json

Lines 19 to 25 in d96a48e

	"exports": {
	".": {
	"style": "./index.css",
	"types": "./src/index.ts",
	"require": "./dist/lib.js",
	"import": "./src/index.ts"
	},

In your main package, you can then use a normal @import "my-library"; in the CSS file.

[imaginario27]

This is how the design system test package looks like when it is installed.

I keep the tailwind main css inside assets/css/main.css and there I import tailwind, the other css files and define the theme variables for Tailwind.

How would the solution look like for this case?

[thecrypticace]

Is this on stackblitz or locally?

[imaginario27]

locally

[imaginario27]

Any possible solution to this case?