使用 tailwind @apply 函数的 Angular 组件特定样式

Question

大部分教程和文章都使用styles.scss中导入顺风依赖的方法

@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

然后在 custom-components.css 或全局级别的某个单独文件中使用 @apply 函数编写自定义样式。

但是如果我想在我的组件范围样式中使用 @apply 函数和 tailwind 怎么办？那可能吗？

目前要么是我的 f.x。 custom-component.css被不同的组件样式污染，或者组件html被很多类污染。

BR

Answer 1

我使用@ngneat/tailwind 将tailwindcss 添加到我的角度项目中，我可以在我的组件的scss 文件中使用@apply。

但是，嵌套似乎并非一直对我有用，最重要的是，dark 变体也无法正常工作 (here is the explanation)。

Tailwind 关于组件的文档是为了避免使用自定义类，如果它很复杂并且只在一个组件中使用，则只将 Tailwind 类保留在 html 中。