Una nota sobre las opciones para organizar Sass / SCSS en una aplicación Angular

¿Cómo estructura los archivos sass / scss en un proyecto Angular? Una vez que hice esta pregunta, encontré varias opciones.

1 vía: mantenga todos los archivos de estilo en la carpeta / styles

En este caso, creamos todos los archivos de la carpeta /styles



, observando la estructura aproximada:

styles 
	├── base 
	├── components
	└── xxxxx
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

Una de las formas populares de estructurar archivos de esta manera es el patrón 7-1 sugerido en la documentación de sass. Se pueden encontrar más detalles aquí en el enlace .

Las ventajas de este enfoque:

1. Todos los archivos de estilo en un solo lugar.

   
   
   
   
   

2. Se acelera la construcción de estilo.

   
   
   
   
   

Desventajas:

1. El desarrollador debe imaginar dónde debe ubicarse el archivo requerido.

   
   
   
   
   

2. .

   
   
   
   
   

2 - , /styles

, , /styles



. , . /styles



, , .

:

1. .

   
   
   
   
   

2. .

   
   
   
   
   

:

1. .

   
   
   
   
   

3 () - , /styles

.

:

1. .

   
   
   
   
   

2. .

   
   
   
   
   

:

1. , .

   
   
   
   
   

, Angular . . , .

Angular ?