CSS doesn't work when classes are applied directly in HTML

Question

I'm running NX workspace with multiple apps in it as a monorepo. Recently I installed I've installed "tailwindcss": "^3.0.2". Here are my configs:

1. Package.json with dev dependencies

2. tailwind.config.js configured

Issues facing:

In SCSS file where I'm using button mixins by applying tailwind classes & re-using my own custom button classes (Works)
Tailwind lib classes applied directly in HTML file for ex: "container mx-auto", "uppercase" (Doesn't work as styles are not applied)

Am Not sure why when tailwind lib classes when applied directly on html classes are not working where as when applied through scss files are working. Any idea?

FAISAL · Accepted Answer · 2021-12-16 20:46:37Z

1

The problem is with the path to the source files (content) which tailwind is unable to find. You need to modify content in your tailwind.config.js to following:

content: [
    './apps/**/src/**/*.{html,ts}', 
    './libs/**/*.html'
],

answered Dec 16, 2021 at 20:46

FAISAL

34.8k10 gold badges102 silver badges107 bronze badges

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

Collectives™ on Stack Overflow

CSS doesn't work when classes are applied directly in HTML

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related