我从另一个sass文件中包含一个sass文件的maxin但是使用ionic serve命令出错了。错误:“Sass错误 “@include”之后的CSS无效:期望的标识符,是'“../../../ theme / mai'”
代码: 从文件中,我正在导入mixin
action-sheet-layout-1 {
@include '../../../theme/main.scss'
@include "settingAnimationHeader"; >>> this is imported mixin define in main.scss
[button-action-shit]
{ z-index: 99999; right: 16px; top: 56px;
... }
mixin代码在main.scss中定义
@mixin settingAnimationHeader {
@keyframes headerOff {
from {
background-color: theme-colors('mainColors', 'primary');
}
to {
background-color: transparent; }
} ... }
我是离子和SASS的新手,我正在做正确的包括或我缺少一些东西。
从APP根目录直接构造两个文件
src / theme / main.scss>>> mixin在此文件中定义。
src / components / action-sheet / layout-1 / action-sheet-layout-1.scss>>> mixin进口。
答案 0 :(得分:3)
答案 1 :(得分:1)
在您的SASS文件(action-sheet-layout-1.scss
)的顶部,您需要添加:@import "../../../theme/main.scss"
,然后您可以通过在css规则中执行main.scss
来访问@include settingAnimationHeader;
内的mixins你想在哪里申请这个混合
答案 2 :(得分:0)
如果mixins是在 main.scss 中定义的,只需确保先导入文件,然后再在 action-sheet-layout-1.scss 中使用它们即可。在这种情况下。