运行项目时sass会出现这种警告 虽然不影响代码运行 ,但是看着很不舒服
警告内容解释
Deprecation Warning: 表示这是一个废弃警告,意味着在未来的版本中,某些行为将会改变。
Sass's behavior for declarations that appear after nested rules: 这指的是在嵌套规则之后出现的声明。
will be changing to match the behavior specified by CSS: 表示Sass将改变其行为,以匹配CSS规范中的行为。
To keep the existing behavior: 如果你希望保持当前的行为,需要将声明移动到嵌套规则之前。
To opt into the new behavior: 如果你希望采用新的行为,可以将声明用& {}包裹起来。
方案一
版本是在1.77.7开始的。 可以固定sass的版本在1.77.6之前。
npm install sass@1.32.13
方案二
声明移动到嵌套规则之前
.line-box {
&.right-box{
position: absolute;
top: 70px;
right: 0;
}
width: 40%;
height: 50px;
display: flex;
line-height: 50px;
}
将声明用& {}包裹起来
修改前:
.line-box {
&.left-box{
position: absolute;
top: 70px;
}
width: 40%;
height: 50px;
display: flex;
line-height: 50px;
}
修改后:
.line-box {
&.left-box{
position: absolute;
top: 70px;
}
& {
width: 40%;
height: 50px;
display: flex;
line-height: 50px;
}
}