`@debug`

在開發樣式表時,查看變數或表達式的值有時很有用。這就是 `@debug` 規則的用途:它的寫法是 `@debug <expression>`,它會印出該表達式的值,以及檔名和行號。

程式碼遊樂場

SCSS 語法

@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});
}
程式碼遊樂場

Sass 語法

@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

💡 小知識

您可以將任何值傳遞給 `@debug`,而不僅僅是字串!它會印出與 `meta.inspect()` 函式相同的該值表示。