如何使用@apply在其他Scss文件中使用顺风
如何使用@apply在其他Scss文件中使用顺风
提问于 2022-01-06 10:39:01
我使用的是Tailwind，我尝试在scss文件上使用@apply，但是vscode告诉我“未知的规则@应用”，我向您展示了我的App.css文件和css配置，我读了关于@App.css的顺风文档，但是我不知道，我一定遗漏了什么
App.css：
@tailwind base;
@tailwind components;
@tailwind utilities;
@import "./unreset.scss";我的scss的一部分：
.unreset {
a {
@apply text-blue-700 underline;
}
p {
@apply my-4;
}
blockquote,
figure {
@apply my-4 mx-10;
}
hr {
@apply border;
}
h1 {
@apply text-4xl font-bold my-2;
}
h2 {
@apply text-2xl font-bold my-3;
}
h3 {
@apply text-lg font-bold my-4;
}
h4 {
@apply text-base font-bold my-5;
}
h5 {
@apply text-sm font-bold my-6;
}
h6 {
@apply text-xs font-bold my-10;
}
}postcss.config.js：
module.exports = {
plugins: [
require('postcss-import'),
require('tailwindcss/nesting')(require('postcss-nesting')),
require('tailwindcss'),
require('postcss-preset-env')({
features: { 'nesting-rules': false }
}),
]
}给您，我编译没有任何问题，只是在我的检查器中，由于@apply，代码没有正确编译。提前感谢您的帮助
回答 1
Stack Overflow用户
回答已采纳
发布于 2022-01-16 12:45:23
可能有两个问题：
@import "unreset";.
- In
- 代替导入
@import "./unreset.scss";尝试@import "./unreset.scss";postcss.config.js，将插件配置导出为对象而不是数组.
module.exports = {
plugins: {
'postcss-import': {},
'tailwindcss': {},
'tailwindcss/nesting': {},
'autoprefixer': {},
}
};页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/70605862
复制相关文章
相似问题
腾讯云开发者
