使用SASS的@error，@warn和@debug指令

Sass 調試利器：@error、@warn 和 @debug 指令

Sass 提供了三個指令來幫助開發者調試代碼：@error、@warn 和 @debug。它們用於在代碼邏輯的任何需要幫助的點上調試任何值並找出代碼的行為。

• @error 指令： 該指令會完全停止 Sass 編譯器，並將文本字符串作為致命錯誤發送到編譯器的輸出。它非常適合驗證 mixin 或函數中的參數，並讓開發者知道他們做錯了什麼，或者輸入了完全不兼容的值。

• @warn 指令： 該指令比 @error 危害性小。它會將消息發送給編譯器供開發者閱讀，但允許編譯器完成其工作並寫入所有 CSS。它適用於棄用通知，或建議開發者遵循某些最佳實踐。

• @debug 指令： 這是三個反饋指令中侵入性最小的一個。它會將包含的任何 Sass 表達式（變量、數學表達式等）的值打印到控制台供開發者查看。它非常適合個人調試工作。

在其他編程語言中，類似的反饋機制非常常見，例如JavaScript 中的console.log() 或alert()，PHP 中的var_dump() 或print_r()，Ruby 中的debug 或inspect 等。這些函數都允許您調試任何值，並在邏輯的任何需要幫助的點上找出代碼的行為。

基本語法和用法

這三個指令遵循相同的語法：

@directive "要输出的文本字符串";

實際上，這三個指令可以接受任何類型的值，而不一定是字符串。這意味著您可以警告、拋出或調試映射、列表、數字、字符串——基本上任何您想要的東西。但是，由於我們經常使用這些指令來提供關於問題的上下文，因此通常會傳遞一個描述情況的字符串。

如果需要在字符串中插入變量的值，可以使用標準的 Sass 插值語法 #{$variable}，變量的值將被打印在字符串中：

@error "抱歉，`#{$variable}` 不是 $variable 的有效值。";

注意：插值周圍的反引號（`）不是必需的。您可能希望包含它們，因為它們為開發人員提供了變量內容的明顯起點/終點。

如果開發者在使用您的 Sass 代碼時犯了錯誤，這些指令會將指定的消息發送到編譯器，編譯器會將該消息顯示給開發者。例如，GUI 應用程序（如 CodeKit）將顯示帶有錯誤的系統通知。某些 Grunt 和 Gulp 通知包也可以做到這一點。

如果開發者使用命令行（Sass、Compass、Grunt 或 Gulp）進行編譯，則消息可能會出現在他們的控制台中（終端、iTerm2、Putty 等）。如果您使用 Sassmeister 或 Codepen 在線編寫 Sass，您只會獲得有限的反饋，但您可能會在編輯器中獲得內聯通知或輸出窗口中的文本。

@error 指令：立即停止編譯

Sass 的 @error 指令會完全停止 Sass 編譯器，並將文本字符串作為致命錯誤發送到編譯器的輸出。當您需要發送立即停止開發者並強制他們立即糾正錯誤的消息時，請使用此指令。這非常適合讓開發者知道他們做錯了什麼，或者輸入了完全不兼容的值。 Sass 將包含任何致命錯誤的行號，包括 @error 輸出。 @error 指令非常適合驗證 mixin 或函數中的參數。

注意：如果您的編譯器早於 Sass 3.4 或 LibSass 3.1，則 @error 不可使用。您可以使用此 log() 函數在舊版 Sass 版本中模擬 @error。

@warn 指令：發出警告，但不停止編譯

@warn 指令比 @error 危害性小得多。它會將消息發送給編譯器供開發者閱讀，但允許編譯器完成其工作並寫入所有 CSS。 @error 適用於糾正完全破壞函數或 mixin 的錯誤，而 @warn 更適合棄用通知，或建議開發者遵循某些最佳實踐。

注意：使用 --quiet 標誌編譯的 Sass 開發者將看不到 @warn 輸出。如果開發者絕對需要看到您的 Sass 發送的反饋，請依賴 @error。 @warn 很少被關閉，但這是可能的。

@debug 指令：調試輸出到控制台

Sass 的 @debug 指令是三個反饋指令中侵入性最小的一個。它會將包含的任何 Sass 表達式（變量、數學表達式等）的值打印到控制台供開發者查看。它在開源或團隊庫中並不完全有用。相反，@debug 非常適合個人調試工作。如果您處於復雜的數學運算中，並且需要知道某個變量當前包含的內容，請使用 @debug 來查找。

總結

沒有反饋的編程將非常糟糕。幸運的是，Sass 有多個指令可以將反饋發送到編譯器，以幫助開發者避免錯誤、維護標準和排除高級邏輯故障。您可以使用 @error、@warn 和 @debug 為自己和任何使用您代碼的其他人提供節省時間的反饋。

(FAQs 部分略去，因為篇幅過長，且與偽原創目標不符。 FAQs 部分內容可以根據需要重新編寫，並整合到正文中，以更自然的方式呈現。)

以上是使用SASS的@error，@warn和@debug指令的詳細內容。更多資訊請關注PHP中文網其他相關文章！