多行CSS @apply无法在生产环境中与Nuxt 3、UnoCSS和SCSS配合使用

w6lpcovy 于 2023-01-10 发布在其他

关注(0)|答案(1)|浏览(1303)

我的应用程序使用的是UnoCSS、Nuxt 3，而我的样式使用的是SCSS
我的一个组件具有此样式表

<style lang="scss">
.tag {
  @apply shadow hover:shadow-lg hover:-translate-y-0.5 no-underline
         capitalize border-b border-transparent rounded px-2 py-1 m-1 inline-block; //line is ignored
  @apply bg-brand-supporting hover:border-gray-400 text-white;
}
</style>

当运行“nuxtdev”时，它工作得很完美，但是，只要我部署它，四舍五入以及填充就会明显丢失，而悬停阴影正在工作。

多行@ application to work / to not work的责任是什么？如何使其工作？

css

来源：https://stackoverflow.com/questions/75034524/multi-line-css-apply-not-working-in-production-with-nuxt-3-unocss-and-scss

1条答案

按热度按时间

bttbmeg01#

经过进一步的测试，结果是每个CSS选择器只允许一个@apply，但是WebStorm既没有抱怨，也没有构建失败或任何事情。
据我所知，多个@apply's与TailwindCSS一起工作，如果我没有记错的话，可能是UnoCSS的一个问题。
不管怎样，这个很管用

.tag {
  @apply shadow hover:shadow-lg hover:-translate-y-0.5 no-underline
  capitalize border-b border-transparent rounded px-2 py-1 m-1 inline-block
  bg-brand-supporting hover:border-gray-400 text-white;
}

赞(0）回复(0）举报 2023-01-10

我来回答

多行CSS @apply无法在生产环境中与Nuxt 3、UnoCSS和SCSS配合使用

1条答案

相关问题

热门标签

最新问答