'Command removing tailwindcss in the input.css

When I run: npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch

My output.css gets mostly deleted, and only contains a handful of tailwind css, see image:

enter image description here

I have to run: npx tailwindcss-cli@latest build ./src/input.css -o ./dist/output.css to rebuild the file which gets all the tailwind css see:

enter image description here

But when I run: npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch it deletes the output.css again!

I've cleared the NPM cache, re-installed Tailwindcss on a new project and it produces the same issue.

Any help would be welcome, just starting out with backend programming!



Solution 1:[1]

If you use the build command tailwind iterate over your content and check which styles you are use. The other styles are purged. That is a feature of tailwind and makes sure you don't load all the overhead styles you don't use into the CSS file.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Maik Lowrey