Tailwind 在带有 nuxt 的 vue 组件的样式中不起作用
Tailwind doesn't work inside the style in a vue component with nuxt
我正在尝试访问组件内的 Tailwind class。
我在 Nuxt js 上使用 Tailwindcss。
我可以通过模板完美访问它。问题是当我尝试访问标签内的 classes 时
<style lang="scss" scoped>
.el-menu-item.is-active {
@apply .bg-black
}
</style>
错误
The .bg-back class does not exist. If .bg-back is a custom class,
make sure it is defined within a @layer directive.
48 | 49 | .el-menu-item.is-active { 50 | @apply .bg-back
| ^ 51 | }
已更新
main.css
@tailwind base;
@tailwind components;
@tailwind utilities;
nuxt.config
css: ['@/assets/css/main'],
您应该使用 'bg-black' 而不是 '.bg-black'； 'bg-black' 是 class 名称，'.bg-black' 是 css 选择器。去掉那个点应该就OK了。
我正在尝试访问组件内的 Tailwind class。
我在 Nuxt js 上使用 Tailwindcss。
我可以通过模板完美访问它。问题是当我尝试访问标签内的 classes 时
<style lang="scss" scoped>
.el-menu-item.is-active {
@apply .bg-black
}
</style>
错误
The
.bg-backclass does not exist. If.bg-backis a custom class, make sure it is defined within a@layerdirective.48 | 49 | .el-menu-item.is-active { 50 | @apply .bg-back | ^ 51 | }
已更新
main.css
@tailwind base;
@tailwind components;
@tailwind utilities;
nuxt.config
css: ['@/assets/css/main'],
您应该使用 'bg-black' 而不是 '.bg-black'； 'bg-black' 是 class 名称，'.bg-black' 是 css 选择器。去掉那个点应该就OK了。