web-dev-qa-db-ja.com

scss / cssでファイル名「_」または「_」の前に配置するのはなぜですか?

Scssでファイル名の前に_を配置するのはなぜですか?

_filename.scss-なぜ_が必要なのですか?

106
Niko_D

_(アンダースコア)はscssのパーシャルです。つまり、スタイルシートはメインのスタイルシート、つまりstyles.scssにインポート(@import)されます。パーシャルを使用する利点は、多くのファイルを使用してコードを整理でき、すべてが単一のファイルにコンパイルされることです。

110
Fabian Parra

アンダースコアで始まるsassファイルは部分的なものです。スタイルを論理セクションに分けておくのに良い方法です。 @importを使用すると、これらのファイルはすべてコンパイル時にマージされます。

Sass言語ガイドから:

他のSassファイルに含めることができるCSSの小さな断片を含む部分的なSassファイルを作成できます。これは、CSSをモジュール化し、物事の保守を容易にするのに役立つ素晴らしい方法です。パーシャルは、先頭にアンダースコアが付いた単純なSassファイルです。 _partial.scssのような名前を付けることができます。アンダースコアは、ファイルが部分的なファイルであり、CSSファイルに生成されるべきではないことをSassに知らせます。 Sassパーシャルは@importディレクティブで使用されます。

http://sass-lang.com/guide

46
cameronjonesweb

_(下線)が付いたファイルは、コンパイラーによって無視されます。ただし、これらのファイルはすべて、実際にコンパイルされるファイルである単一のメインSCSSファイル(つまり、styles.scss)にインポートされます(名前に_(アンダースコア)はありません)

最終目標は、1つのSCSSファイルのみをコンパイルし、その結果として1つのCSSファイルのみを持つことであり、これにはさまざまな利点があります。

6
Tahi Reu

ファイル名の前に「_」を含めると、部分的ではない別のsassファイルにインポートしない限り、CSSに生成されません。

あなたのフォルダ構造はこのようなものだと仮定します

/scss
 style.scss
 _list.scss
/css

コマンドを実行した場合

sass --watch scss:css

style.cssおよびstyle.css.mapファイルのみが作成され、sassコンパイラーはそのコンテンツをCSSファイルに変換せずに_list.scssを省略します。

/scss
 style.scss
 _list.scss
/css
 style.css
 style.css.map

パーシャルを使用できる唯一の方法は、パーシャルを別の.scssファイルにインポートすることです

@import 'list.scss';

_test.scssの前にある「_」を削除すると、コマンドの結果は

/scss
 style.scss
 _list.scss
/css
 style.css
 style.css.map
 test.css
 test.css.map

パーシャルを使用する主な目的は、CSSコードを保守しやすいいくつかの部分に分割することです。お役に立てれば。ありがとう。

3
dmcshehan