Зачем ставить перед именем файла «_» или «_» в scss / css?

147

Зачем ставить _перед именем файла в Scss?

_filename.scss- Зачем это нужно _?

Niko_D
источник

Ответы:

147

_ (Подчеркивание) является частным для scss. Это означает, что таблица стилей будет импортирована (@import) в основную таблицу стилей, т.е. styles.scss. Преимущество использования партиалов в том, что вы можете использовать много файлов для организации своего кода, и все будет скомпилировано в один файл.

Фабиан Парра
источник
3
но import '_file';и import '_file';делает ли то же самое правильно?
Tom10271
20
@aokaddaoc, кажется, вы написали одну и ту же строку кода :)
Amit
21
О, спасибо, что указали на мою ошибку. "но import '_file';и import 'file';делает ли то же самое правильно?"
Tom10271
5
Если я структурирую свои файлы так, что я отправляю только один файл моему компилятору / препроцессору, почему это имеет значение, если к моим файлам добавляется префикс _? Я рассматриваю возможность удаления подчеркивания из имен файлов. То, является ли файл Sass частичным (то есть импортируемым фрагментом кода), должно зависеть от его расположения в архитектуре вашего проекта, а не от того, как назван файл.
ESR
1
@ESR: Согласен, эта функция выглядит немного устаревшей в современной среде веб-разработчиков. Вам определенно не нужны _s, если ваш проект структурирован разумным образом.
Крис Джейнс
55

Файл sass, начинающийся с подчеркивания, является частичным. Это хороший способ разделить ваши стили на логические разделы. Эти файлы объединяются при компиляции при использовании @import.

Из руководства по языку Sass:

Вы можете создавать частичные файлы Sass, которые содержат небольшие фрагменты CSS, которые вы можете включить в другие файлы Sass. Это отличный способ модульности вашего CSS и облегчения обслуживания. Частичное - это просто файл Sass с именем, начинающимся с подчеркивания. Вы могли бы назвать это что-то вроде _partial.scss. Подчеркивание позволяет Sass знать, что файл является только частичным файлом и что его не следует создавать в файле CSS. Частицы Sass используются с директивой @import.

http://sass-lang.com/guide

cameronjonesweb
источник
14

Когда вы добавляете «_» перед именем файла, он не будет сгенерирован в CSS, если вы не импортируете его в другие файлы sass, которые не являются частичными.

Предположим, что ваша структура папок такая

/scss
 style.scss
 _list.scss
/css

если вы запустите команду

sass --watch scss:css

Будут созданы только файлы style.css и style.css.map, компилятор sass пропустит _list.scss без преобразования его содержимого в файл CSS.

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

единственный способ использовать партиалы - это импортировать их в другой файл .scss с

@import 'list.scss';

если вы удалите '_' перед _list.scss, результат команды будет

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

Основная цель использования партиалов - разбить наш CSS-код на несколько частей, которые проще поддерживать. Надеюсь это поможет. Спасибо.

dmcshehan
источник
3
Это правильный ответ. Но вы также не упомянули особый случай _index.scss: sass-lang.com/documentation/at-rules/import#index-files
tiffon
11

Файлы с _ (подчеркивание) игнорируются компилятором. Однако все эти файлы импортируются в один основной файл SCSS (т. Е. Styles.scss), который на самом деле является файлом, который скомпилирован (в его имени нет _ (подчеркивания))

Конечная цель состоит в том, чтобы скомпилировать только один файл SCSS и получить в результате только один файл CSS, что имеет различные преимущества.

Таи Реу
источник
0

Также использование наблюдателя node-sass в среде узлов приведет к появлению сообщений об ошибках, если вы не используете префикс подчеркивания, см. Https://github.com/sass/node-sass/issues/2762

Иоахим
источник