7+1 模式指的是通过一个文件和七个文件夹管理 CSS 样式

1 个文件

main.scss 是入口文件, 用于导入其他七个文件夹的 CSS 样式

7 个文件夹

• abstracts
• base
• components
• layout
• pages
• themes
• vendors

Base

base 用于存放项目中的模板文件。定义一些 HTML 元素公认的标准样式

---

Layout

layout 用于存放构建网站或者应用很小使用到的布局部分

---

Components

components 包含各类具体模块，基本上是所有的独立模块

---

Pages

pages 存放页面文件，就是那个页面内具有独特的样式

---

Theme

themes 主题文件夹, 每个文件存放着整个 app 的变量，组件的样式值基本引用于该文件

---

Abstract

abstract 辅助工具文件夹，可以存放每一个全局变量、函数、混合宏以及占位符

---

Vendors

vendors 外来项目文件夹，存放一些外部库和框架