Po co umieszczać przed nazwą pliku „_” lub „_” w scss / css?

147

Po co umieszczać _przed nazwą pliku w scss?

_filename.scss- Dlaczego to potrzebne _?

Niko_D
źródło

Odpowiedzi:

147

_ (Podkreślenie) jest częścią dla scss. Oznacza to, że arkusz stylów zostanie zaimportowany (@import) do głównego arkusza stylów, tj. Styles.scss. Zaletą korzystania z podrzędnych jest to, że możesz użyć wielu plików do zorganizowania kodu i wszystko zostanie skompilowane w jednym pliku.

Fabian Parra
źródło
3
ale import '_file';i import '_file';robi to samo, prawda?
tom10271
20
@aokaddaoc wydaje się, że napisałeś tę samą linię kodu :)
Amit
20
Och, dziękuję za wskazanie mojego błędu. "ale import '_file';i import 'file';robi to samo, prawda?"
tom10271
5
Jeśli ustrukturyzuję moje pliki w taki sposób, że wysyłam tylko jeden plik do mojego kompilatora / preprocesora, dlaczego ma znaczenie, czy moje pliki są poprzedzone _? Rozważam usunięcie podkreślenia z moich nazw plików. To, czy plik Sass jest częściowy (tj. Importowany fragment kodu), powinno zależeć od jego lokalizacji w architekturze projektu, a nie od tego, jak plik jest nazwany.
ESR
1
@ESR: Zgoda, ta funkcja wydaje się nieco przestarzała w nowoczesnym środowisku programistycznym. Zdecydowanie nie potrzebujesz tych _znaków, jeśli masz projekt uporządkowany w rozsądny sposób.
Chris Jaynes
55

Plik Sass rozpoczynający się od podkreślenia jest podrzędny. To dobry sposób na podzielenie stylów na logiczne sekcje. Wszystkie te pliki są scalane podczas kompilacji, gdy używasz @import.

Z przewodnika językowego Sass:

Możesz tworzyć częściowe pliki Sass, które zawierają małe fragmenty kodu CSS, które możesz dołączyć do innych plików Sass. To świetny sposób na modularyzację CSS i ułatwianie utrzymania. Częściowe to po prostu plik Sass o nazwie z początkowym podkreśleniem. Możesz nazwać to coś w rodzaju _partial.scss. Podkreślenie informuje Sassa, że ​​plik jest tylko częściowym plikiem i nie powinien być generowany w pliku CSS. Części składowe Sass są używane z dyrektywą @import.

http://sass-lang.com/guide

cameronjonesweb
źródło
13

Kiedy dodasz „_” przed nazwą pliku, nie zostanie on wygenerowany w CSS, chyba że zaimportujesz go do innego pliku Sass, który nie jest częściowy.

załóżmy, że twoja struktura folderów jest taka

/scss
 style.scss
 _list.scss
/css

jeśli uruchomisz polecenie

sass --watch scss:css

zostaną utworzone tylko pliki style.css i style.css.map, kompilator sass pominie _list.scss bez konwertowania jego zawartości na plik CSS.

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

jedynym sposobem na użycie podszablonów jest zaimportowanie ich do innego pliku .scss z rozszerzeniem

@import 'list.scss';

jeśli usuniesz „_” przed _list.scss, wynik polecenia będzie

/scss
 style.scss
 list.scss
/css
 style.css
 style.css.map
 list.css
 list.css.map

Głównym celem używania podszablonów jest rozbicie naszego kodu CSS na kilka części, które są łatwiejsze w utrzymaniu. Mam nadzieję że to pomoże. Dzięki.

dmcshehan
źródło
2
To jest właściwa odpowiedź. Ale nie wspomniałeś też o specjalnym przypadku _index.scss: sass-lang.com/documentation/at-rules/import#index-files
tiffon
11

Pliki z _ (podkreśleniem) są ignorowane przez kompilator. Jednak wszystkie te pliki są importowane do pojedynczego, głównego pliku SCSS (tj. Styles.scss), który jest faktycznie kompilowanym plikiem (nie ma w nazwie znaku _ (podkreślenia))

Ostatecznym celem jest skompilowanie tylko jednego pliku SCSS, aw rezultacie tylko jednego pliku CSS, co ma różne zalety.

Tahi Reu
źródło