Using the 7–1 Sass/SCSS Pattern with Angular 7

Aaron Verones
3 min readJan 6, 2019

The 7–1 pattern is a common Sass architecture, and is recommended by the Sass Guidelines Project. Here’s the basic structure:

Hugo Giraudel, Sass Guidelines Project

To make the 7–1 pattern work with Angular, a few modifications are needed. Here’s my take on it. Enjoy!

Creating the Directory Structure

--

--

Aaron Verones

Full-time developer, part-time soldier. Strong belief that a person’s most important skill is their ability to work on a team.