[v4] TailwindCSS CLI not finding any sources

[alvaromarithompson]

Hi guys,

I've got an existing TailwindCSS v3.4 project which is being used with ASP.NET 8.0 and vanilla javascript. I've tried to upgrade Tailwind from 3.4 to 4.0, but when minifying the output, it generates a blank file. I've tried messing around with using different source directives, using the @config directive to point to the 3.4 tailwind.config.js and anything else I can think, but output.css is consistently blank which suggests tailwind cli is not finding any sources (I can't find a way for it to verbosely tell me where it's looking?)

I've tried to simplify the problem by creating a blank ASP.NET project which I've put up at https://github.com/alvaromarithompson/aspnet-tailwind4-sample

It's got a simple wwwroot/css/input.css with @import "tailwindcss";. Under Views/Home/Index.cshtml I've put in a bit of content with some tailwind classes in it.

I then, from the root of the project, run:

npx @tailwindcss/cli -i ./wwwroot/css/input.css -o ./wwwroot/css/output.css --minify

And output.css is blank.

I have tried things like:

@import "tailwindcss" source("../../Views");

or

@import "tailwindcss" source(none);

@source "../../Views/Home"

To no avail.

The sample project I put together has no .gitignore files anywhere.

What am I doing wrong? Why are the sources not being scanned and required css classes generated in output.css?

[wongjn]

See #15662 (comment):

Check your file encoding. I found that it happens if I have UTF-8 with BOM. Removing BOM fixes the CLI

Your wwwroot/css/input.css is encoded with UTF-8 with BOM. Resaving as UTF-8 got it working for me.

[alvaromarithompson]

Mind boggling bug, thanks for the quick response 👍