How to remove unnecessary css when it compiled to output in TailwindCSS?

Question

I'm combining tailwindcss with another ui framework (Ant Design), but having some conflicts with the css in tailwind. I want to compile the necessary classnames if it is used to minimize conflicts

My expect example:

<div className="text-center font-bold" />

After compiled in output.css file:

.text-center { text-align: center; } .font-bold { font-weight: bold; }

which this output results should not included css default like:

html{-moz-tab-size:4;-o-tab-size:4;tab-size:4;line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji} .text-center { text-align: center; } .font-bold { font-weight: bold; }

doğukan · Accepted Answer · 2022-01-04 11:47:17Z

2

Just disable Preflight

// tailwind.config.js module.exports = { .... corePlugins: { preflight: false, } }

answered Jan 4, 2022 at 11:47

doğukan

28k15 gold badges67 silver badges79 bronze badges

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

Collectives™ on Stack Overflow

How to remove unnecessary css when it compiled to output in TailwindCSS?

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related