@debug

在开发样式表时，有时查看变量或表达式的值会很有用。这就是 @debug 规则的作用：它的写法是 @debug <表达式>，它会打印该表达式的值，并附带文件名和行号。

  SCSS

  Sass

      
      Playground
    SCSS Syntax@mixin inset-divider-offset($offset, $padding) {
  $divider-offset: (2 * $padding) + $offset;
  @debug "divider offset: #{$divider-offset}";

  margin-left: $divider-offset;
  width: calc(100% - #{$divider-offset});
}

      
      Playground
    Sass Syntax@mixin inset-divider-offset($offset, $padding)
  $divider-offset: (2 * $padding) + $offset
  @debug "divider offset: #{$divider-offset}"

  margin-left: $divider-offset
  width: calc(100% - #{$divider-offset})

调试消息的确切格式因实现而异。以下是 Dart Sass 中的显示效果：

test.scss:3 Debug: divider offset: 132px

💡 Fun fact:

你可以传递任何值给 @debug，不仅仅是字符串！它会打印与 meta.inspect() 函数相同的值表示。