Angular tailwind utilities working fine in development, but not in production

Question

When I build my Angular project I only sometimes get "No utility classes were detected in your source files." using tailwind, and sometimes it builds without warning but still no utilities. This happened all of a sudden, being built many times before, with working utilities. The base tailwind reset gets implemented in the styles, but not utilities..
It's also worth mentioning that classes i build from the styles with @apply works fine.

tailwind.config.js:

content: ["./src/**/*.{html,ts}"],

build command:

ng build --output-path docs

included in styles.css:

@tailwind base;
@tailwind components;
@tailwind utilities;

orindholt · Accepted Answer · 2022-03-03 23:02:25Z

3

A coworker found a solution to this. For some unknown reason you have to include multiple file extensions to the tailwind config content string, even if they aren't used.

content: ["./src/**/*.{html,ts,tsx,jsx}"],

answered Mar 3, 2022 at 23:02

orindholt

11310 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Esteve Over a year ago

You saved my day! Any explanation about what happened?

orindholt Over a year ago

Good to hear! :) Still not sure why this happened specifically in Angular.

Esteve Over a year ago

FYI: I faced today the same issue. Nothing in tailwind config was changed since last time. I've removed "tsx,jsx" since I don't have these kind of files, and then the build was fixed. Very strange.

Esteve Over a year ago

This answer could explain that: stackoverflow.com/a/73231393/1409595

Collectives™ on Stack Overflow

Angular tailwind utilities working fine in development, but not in production

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related