带有 postcss 和 css 模块的 Tailwindcss

Question

我认为 Tailwind CSS 与 CSS 模块/post css 可以很好地协同工作。编写更少的代码并生成更少的 CSS 但是......

当我将 tailwind 与 @apply 一起使用时，它只是将样式应用于该类

例子

.root {
  @apply flex align-center;
}

从 styles.root 到 "root flex align-center" 但它只是将 css 添加到 .root 类

我认为它应该像composes: flex align-center from global;一样工作

是我的配置错误还是只是这样工作？

Answer 1

这就是@apply directive 的工作原理。 @apply 用于将任何现有的实用程序类内联到您自己的自定义 CSS 中。

/* Input */
.root {
    @apply flex items-center;
}

/* Output */
.root {
    display: flex;
    align-items: center;
}