SCSS でファイル名の前に「_」が追加されるのはなぜですか?

SCSS を使用すると、開発者はより構造化された方法で CSS を作成できます。また、SCSS の使用中に CSS 用の複数のファイルを作成し、必要なファイルをメインの SCSS ファイルにインポートすることもできます。

このチュートリアルでは、SCSS でファイル名の前に「_」を追加するという目標を見ていきます。

SCSS でファイル名の前に「_」を付ける必要があるのはどのような場合ですか?

SCSS でファイル名の前に -_' を追加すると、コンパイラは SCSS のコンパイル中にファイルを無視します。ファイル名が「_」文字で始まる場合、そのファイルは部分ファイルになります。

たとえば、「style.scss」と「_partial.scss」という名前の 2 つのファイルがあります。コンパイラは style.scss ファイルのみをコンパイルし、_partial.scss ファイルを無視します。ただし、_partial.scss ファイルの CSS を使用する必要がある場合は、それを style.scss ファイルにインポートできます。

＃＃＃例＃＃＃

次の例は、HTML で SCSS を使用する方法を示しています。

ファイル名 – demo.html

SCSS コンパイラによって生成された「

」タグを使用して、以下のファイルに「style.css」ファイルを追加しました。出力では、CSS が div 要素のテキストに適用され、テキストが斜体になっていることがわかります。

リーリー

ファイル名 – style.scss

以下のファイルでは、フォントのサイズとスタイルを保存する変数を作成しました。その後、変数を使用して div 要素のスタイルを設定します。

リーリー

ファイル名 – style.css

style.scss ファイルをコンパイルすると、html ファイルで使用される次のコードが生成されます。

リーリー ＃＃＃例＃＃＃ リーリー ＃＃＃例＃＃＃

この例では、ファイル名の前に「_」を追加する方法と、メインの CSS ファイルでその CSS を使用する方法を示します。

ファイル名 – demo.html

以下のファイルには単純な HTML コードが含まれており、

タグ内に「style.css」ファイルが含まれています。

リーリー ファイル名 - _partial.css

ユーザーは、ファイル名の前に「_」を付けて _partial.scss ファイルを作成する必要があります。その後、ユーザーはファイルに次のコードを追加する必要があります。 SCSS コードをコンパイルするとき、コンパイラはこのファイルのコードを無視します リーリー

ファイル名 – style.scss

ここで、ユーザーはメインの CSS ファイルである style.scss ファイルに次のコードを追加する必要があります。以下のコードでは、「_partial.css」ファイルから CSS をインポートしています。こうすることで、ファイルの一部のコードを使用できます。

リーリー

ファイル名 – style.css

style.scss ファイルをコンパイルすると、style.css ファイルが自動的に生成されます。

リーリー ＃＃＃例＃＃＃ リーリー

SCSS でファイル名の前に「_」を挿入する主な目的は、コンパイラがファイルを無視できるようにファイルを部分化することです。部分ファイルの CSS を使用する必要がある場合は、それをメイン ファイルにインポートできます。 部分ファイルを使用する主な利点は、重複したコードを記述する必要がなくなり、コードがわかりやすくなることです。たとえば、CSS のさまざまな部分にさまざまな部分ファイルを追加し、必要に応じて使用できます。

以上がSCSS でファイル名の前に「_」が追加されるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。