破壊的変更: メディアクエリレベル 4

SassはCSSメディアクエリレベル4の仕様のサポートを追加しました。これは元々Sass固有の構文と衝突していたため、この構文は非推奨となり、現在はCSS標準に従って解釈されます。

互換性
Dart Sass
1.56.0以降
LibSass
✗
Ruby Sass
✗

Sassは括弧で囲まれたメディア条件でほぼすべてのSass式をサポートしているため、メディアクエリレベル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は簡潔モードで実行され、追加の警告を抑制する前に、各タイプの非推奨警告を5回だけ出力します。これにより、ユーザーは、コンソールに大量のノイズを発生させることなく、今後発生する破壊的な変更について知っておく必要があることを確実に把握できます。 

代わりにSassを詳細モードで実行すると、検出されたすべての非推奨警告が出力されます。これは、非推奨を修正する際に残りの作業を追跡するのに役立ちます。コマンドラインで--verboseフラグを使用するか、JavaScript APIでverboseオプションを使用すると、詳細モードを有効にできます。

⚠️ 注意！

JS APIから実行すると、Sassはコンパイル間で情報を共有しないため、デフォルトでは、コンパイルされる各スタイルシートに対して5つの警告が出力されます。ただし、1つの非推奨に対して5つのエラーのみを出力し、複数のコンパイルで共有できるカスタムLoggerを作成する（またはお気に入りのフレームワークのSassプラグインの作成者に依頼する）ことで、これを修正できます。 

依存関係の非推奨の抑制依存関係の非推奨の抑制のパーマリンク

場合によっては、依存関係に、対処できない非推奨警告が含まれていることがあります。コマンドラインで--quiet-depsフラグを使用するか、JavaScript APIでquietDepsオプションを使用すると、アプリの非推奨警告を出力しながら、依存関係からの非推奨警告を抑制できます。

このフラグの目的上、「依存関係」とは、エントリポイントスタイルシートからの相対的な読み込みの連続に過ぎないスタイルシート以外のものを指します。つまり、ロードパスからくるもの、およびカスタムインポーターを介してロードされたほとんどのスタイルシートを指します。 

特定の非推奨の抑制特定の非推奨の抑制のパーマリンク

特定の非推奨が問題にならないことがわかっている場合は、コマンドラインで--silence-deprecationフラグを使用するか、JavaScript APIでsilenceDeprecationsオプションを使用すると、その特定の非推奨に関する警告を抑制できます。