重大变更:空(Null)Alpha 通道
在 Dart Sass 1.64.3 之前,在 JS 和 Dart API 中,如果向 SassColor
构造函数传递 null
,它将被视为 1。现在这种做法已被弃用。用户应该显式地传递 1 或 undefined
。
Sass 正在添加对 CSS 颜色模块 4 级 的支持。该模块的变化之一是"缺失组件"的概念:如果颜色组件(如 alpha
)缺失,它大多被视为 0,但如果它与另一种颜色插值(例如在渐变或动画中),它将自动采用另一种颜色的值。
我们需要一种方法让 JS 和 Dart API 的用户访问和设置缺失的通道,null
是最自然的方式。在大多数情况下,这不是问题;打算创建不透明颜色的调用者通常只是省略 alpha
参数(或在 JS 中传递 undefined
)。但是,如果调用者显式地传递 null
,最终它将被视为透明颜色,而不是不透明颜色。
要保留当前行为,你只需要在 alpha
未设置时显式地传递 1。在 JS 中:
new sass.SassColor({
red: 102,
green: 51,
blue: 153,
alpha: alpha ?? 1,
});
在 Dart 中:
sass.SassColor.rgb(102, 51, 153, alpha ?? 1);
💡 Fun fact:
Sass API 的 TypeScript 类型已经禁止将 null
作为 alpha
传递;它只允许缺失、undefined
或 Number
。但在 Dart Sass 1.64.3 之前,如果你没有使用 TypeScript 并且确实传递了 null
,它仍然会被视为不透明颜色。
过渡期过渡期 permalink
- Dart Sass
- since 1.64.3
- LibSass
- ✗
- Ruby Sass
- ✗
Compatibility:
在 Dart Sass 1.64.3 和即将发布的 CSS 颜色 4 级支持之间,Dart Sass 将继续将 null
的 alpha
值解释为不透明颜色。但是,它将发出弃用警告,鼓励作者显式地传递 alpha
1。