如何在 TailwindCSS 中编译输出时删除不必要的 css？

Question

我正在将 tailwindcss 与另一个 ui 框架（Ant Design）相结合，但与 tailwind 中的 css 有一些冲突。如果用于减少冲突，我想编译必要的类名

我期望的例子：

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

在 output.css 文件中编译后：

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

这个输出结果不应该包括css默认像：

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;
}

Answer 1

只需禁用Preflight

// tailwind.config.js

module.exports = {
  ....
  corePlugins: {
    preflight: false,
  }
}

如何在 TailwindCSS 中编译输出时删除不必要的 css？

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

tailwind-css