重大变更:严格的一元运算符
Sass 历史上允许使用 -
和 +
以一种方式,使得难以区分作者是打算将其用作二元运算符还是一元运算符。这种令人困惑的语法即将被弃用。
此属性是如何编译的?
一些用户可能会说“-
附加到 $size
上,因此它应该是 margin: 20px -10px
”。其他人可能会说“-
在 20px
和 $size
之间,因此它应该是 margin: 5px
”。Sass 目前同意后一种观点,但真正的问题是它本身就非常令人困惑!这是 CSS 的空格分隔列表语法与 Sass 的算术语法相结合的自然但不幸的结果。
因此,我们将使其成为错误。将来,如果您想使用二元 -
或 +
运算符(即减去或添加两个数字的运算符),则需要在两侧或都不加空格。
- 有效:
15px - $size
- 有效:
(15px)-$size
- 无效:
15px -$size
如果要将一元 -
或 +
运算符用作空格分隔列表的一部分,则(仍然)需要将其括在括号中。
- 有效:
15px (-$size)
过渡期过渡期 链接
- Dart Sass
- 自 1.55.0 起
- LibSass
- ✗
- Ruby Sass
- ✗
我们将在 Dart Sass 2.0.0 中将其设为错误,但在那之前,它只会发出弃用警告。
💡 有趣的事实
请记住,您可以关闭来自您无法控制的库的弃用警告!如果您使用的是命令行界面,则可以传递 --quiet-deps
标志,如果您使用的是 JavaScript API,则可以将 quietDeps
选项 设置为 true
。
自动迁移自动迁移 链接
您可以使用 Sass 迁移工具 自动更新您的样式表,以在任何需要它的 -
或 +
运算符之后添加空格,这将保留这些样式表的现有行为。
$ npm install -g sass-migrator
$ sass-migrator strict-unary **/*.scss
我可以关闭警告吗?我可以关闭警告吗? 链接
Sass 提供了一套强大的选项来管理您看到的弃用警告以及何时看到。
简洁和详细模式简洁和详细模式 链接
默认情况下,Sass 以简洁模式运行,其中它只会打印每种类型的弃用警告五次,然后它会静默其他警告。这有助于确保用户在需要了解即将发生的重大更改时知道,而不会产生过多的控制台噪音。
如果您改为以详细模式运行 Sass,它将打印遇到的每个弃用警告。这对于跟踪修复弃用时需要完成的工作很有用。您可以使用命令行上的 --verbose
标志 或 JavaScript API 中的 verbose
选项 启用详细模式。
⚠️ 注意!
从 JS API 运行时,Sass 不会在编译之间共享任何信息,因此默认情况下,它会为编译的每个样式表打印五个警告。但是,您可以通过编写(或要求您最喜欢的框架的 Sass 插件的作者编写)一个 自定义 Logger
来修复此问题,该 Logger
仅打印每个弃用五个错误,并且可以在多个编译之间共享。
关闭依赖项中的弃用关闭依赖项中的弃用 链接
有时,您的依赖项具有您无法解决的弃用警告。您可以使用命令行上的 --quiet-deps
标志 或 JavaScript API 中的 quietDeps
选项 关闭依赖项中的弃用警告,同时仍为您的应用程序打印这些警告。
出于此标志的目的,“依赖项”是指任何不仅仅是从入口点样式表进行一系列相对加载的样式表。这意味着来自加载路径的任何内容,以及通过自定义导入器加载的大多数样式表。
关闭特定弃用关闭特定弃用 链接
如果您知道某个特定弃用对您来说不是问题,则可以使用命令行上的 --silence-deprecation
标志 或 JavaScript API 中的 silenceDeprecations
选项 关闭该特定弃用的警告。