生产环境下Tailwind CSS是否会移除未使用的自定义CSS类？

默认情况下，外部CSS文件中普通的自定义CSS类不会被Tailwind的生产构建移除，具体逻辑可参考以下说明：

• Tailwind 自带的未使用样式清理逻辑，默认仅扫描处理自身生成的工具类、@apply 生成的样式，以及被 @layer 指令包裹的自定义样式：

  如果你把自定义类放在@layer components或@layer utilities块中，无论写在Tailwind入口CSS还是单独引入的外部CSS文件里，这部分样式都会被Tailwind纳入扫描范围，未在项目内容中被使用的类会在生产构建阶段被移除。

• 没有被@layer包裹的普通自定义样式，无论是否被使用，都不会被Tailwind的默认清理逻辑删除，会完整保留在最终的生产构建产物中。

你可以参考以下代码示例区分两种情况：

/* 以下代码写在外部引入的 custom.css 文件中 */

/* 这类普通自定义类不会被Tailwind清理，未使用也会保留 */
.custom-card {
  padding: 1rem;
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

@layer components {
  /* 这类被@layer包裹的自定义类会被Tailwind扫描，未使用则会在生产构建时移除 */
  .custom-primary-btn {
    @apply px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors;
  }
}

额外说明：如果你自行配置了全局CSS清理工具（比如单独配置了purgecss插件），则自定义样式的清理逻辑以你配置的工具规则为准，和Tailwind自身逻辑无关。

内容的提问来源于stack exchange，提问作者Rashed Rahat