重大變更:Media Queries Level 4

Sass 已新增對 CSS Media Queries Level 4 規範的支援。這原本與某些 Sass 特有的語法衝突,因此該語法已被棄用,現在會根據 CSS 標準進行解譯。

相容性
Dart Sass
自 1.56.0 版起
LibSass
Ruby Sass

由於 Sass 在括號媒體條件中支援幾乎所有 Sass 運算式,因此新增對 Media Queries Level 4 的完整支援後,會變更一些結構的意義。 具體來說

  • @media (not (foo)) 過去在 Sass 中被解譯為 @media (#{not (foo)}),因此會編譯為 @media (false)

  • @media ((foo) and (bar))@media ((foo) or (bar)) 也同樣被解譯為 SassScript 的邏輯運算子,分別編譯為 @media (bar)@media (foo)

幸運的是,這些情況在實際應用中很少出現。 

過渡期過渡期永久連結

相容性
Dart Sass
自 1.54.0 版起
LibSass
Ruby Sass

首先,我們針對先前模稜兩可的情況發出棄用警告。這些警告會提供如何保留現有行為或如何使用新的 CSS 語法的建議。

我可以隱藏警告嗎?我可以隱藏警告嗎? 永久連結

Sass 提供了一套強大的選項,可讓您管理看到的棄用警告以及何時看到這些警告。 

簡潔模式與詳細模式簡潔模式與詳細模式 永久連結

Sass 預設以簡潔模式執行,它只會針對每種類型的棄用警告印出五次,之後就會停止顯示更多警告。這有助於確保使用者在不會被大量的控制台訊息淹沒的情況下,了解即將發生的重大變更。

如果您以詳細模式執行 Sass,它會印出遇到的*每個*棄用警告。這在修正棄用問題時,對於追蹤剩餘工作很有用。您可以使用命令列上的 --verbose 旗標 或 JavaScript API 中的 verbose 選項 來啟用詳細模式。

⚠️ 注意!

JS API 執行時,Sass 不會在編譯之間共用任何資訊,因此預設會針對*每個*編譯的樣式表印出五個警告。然而,您可以透過撰寫(或請您最愛框架的 Sass 外掛程式作者撰寫)一個 自訂的 Logger 來解決此問題,該記錄器只會針對每個棄用印出五個錯誤,並且可以在多個編譯之間共用。

隱藏 dependencies 中的棄用警告隱藏 dependencies 中的棄用警告 permalink

有時,您的 dependencies 會有一些您無能為力的棄用警告。您可以使用命令列上的 --quiet-deps 旗標 或 JavaScript API 中的 quietDeps 選項 來隱藏 dependencies 的棄用警告,同時仍會印出應用程式本身的棄用警告。

就這個旗標而言,「dependency」是指任何不是僅從入口樣式表進行一系列相對載入的樣式表。這表示任何來自載入路徑的樣式表,以及大多數透過自訂匯入器載入的樣式表。

隱藏特定棄用警告隱藏特定棄用警告 permalink

如果您知道某個特定的棄用警告對您來說不是問題,您可以使用命令列上的 --silence-deprecation 旗標 或 JavaScript API 中的 silenceDeprecations 選項 來隱藏該特定棄用警告。