¿Por qué poner delante del nombre de archivo "_" o "_" en scss / css?

147

¿Por qué poner _delante del nombre del archivo en scss?

_filename.scss- ¿Por qué lo necesita _?

css sass Niko_D
fuente

Respuestas:

147

El _ (guión bajo) es parcial para scss. Eso significa que la hoja de estilo se importará (@import) a una hoja de estilo principal, es decir, styles.scss. La ventaja de usar parciales es que puede usar muchos archivos para organizar su código y todo se compilará en un solo archivo.

Fabian Parra
fuente
3
pero import '_file';y import '_file';hace lo mismo ¿verdad?
tom10271
20
@aokaddaoc parece que escribiste la misma línea de código :)
Amit
20
Oh, gracias por señalar mi error. "pero import '_file';y import 'file';hace lo mismo ¿verdad?"
tom10271
55
Si estructuro mis archivos de una manera en la que solo envío un solo archivo a mi compilador / preprocesador, ¿por qué importa si mis archivos se agregan previamente _? Estoy considerando eliminar el guión bajo de mis nombres de archivo. Si un archivo Sass es parcial o no (es decir, un fragmento de código importante) debe depender de su ubicación en la arquitectura de su proyecto, no de cómo se nombra el archivo.
ESR
1
@ESR: De acuerdo, esta característica se siente un poco desactualizada en un entorno moderno de desarrollo web. Definitivamente no necesita los _correos electrónicos si tiene su proyecto estructurado de manera razonable.
Chris Jaynes
55

Un archivo sass que comienza con un guión bajo es parcial. Es una buena manera de mantener sus estilos separados en secciones lógicas. Todos estos archivos se fusionan en la compilación cuando los usa @import.

De la guía de idiomas Sass:

Puede crear archivos Sass parciales que contienen pequeños fragmentos de CSS que puede incluir en otros archivos Sass. Esta es una excelente manera de modularizar su CSS y ayudar a mantener las cosas más fáciles de mantener. Un parcial es simplemente un archivo Sass nombrado con un guión bajo. Puede nombrarlo como _partial.scss. El guión bajo le permite a Sass saber que el archivo es solo un archivo parcial y que no debe generarse en un archivo CSS. Los parciales Sass se usan con la directiva @import.

http://sass-lang.com/guide

cameronjonesweb
fuente
14

Cuando incluye "_" delante del nombre del archivo, no se generará en CSS a menos que lo importe en otro archivo sass que no sea parcial.

supongamos que la estructura de su carpeta es así

/scss
 style.scss
 _list.scss
/css

si ejecutas el comando

sass --watch scss:css

solo se crearán los archivos style.css y style.css.map, el compilador sass omitirá _list.scss sin convertir su contenido en un archivo CSS.

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

la única forma de usar parciales es importarlos a otro archivo .scss con 

@import 'list.scss';

si elimina el '_' delante de _list.scss, el resultado del comando será

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

El objetivo principal de usar parciales es dividir nuestro código CSS en varias partes que son más fáciles de mantener. Espero que esto ayude. Gracias.

dmcshehan
fuente
3
Esta es la respuesta correcta. Pero tampoco mencionó el caso especial de _index.scss: sass-lang.com/documentation/at-rules/import#index-files
tiffon
11

El compilador ignora los archivos con _ (guión bajo). Sin embargo, todos esos archivos se importan en un solo archivo SCSS principal (es decir, styles.scss) que en realidad es el archivo que se compila (no tiene _ (guión bajo) en su nombre)

El objetivo final es compilar solo un archivo SCSS y tener un solo archivo CSS como resultado, lo que tiene varias ventajas.

Tahi Reu
fuente