SASS - 架构和加载

Question

我在我的 Symfony2 上使用 SASS，我阅读了 few articles 关于推荐的 sass 架构。

• base/ - 包含全局样式，例如重置、排版、颜色、 等
• components/ - 将每个独立组件包含在其自己的 .scss 中 部分
• layout/ - 包含较大布局组件的样式；例如导航， 页眉、页脚等
• pages/ - 如有必要，包含特定于页面的样式
• themes/ - 包含不同主题的样式
• utils/ - 包含全局混合、函数、辅助选择器等。
• vendors/ - 包含 3rd-party 样式、mixin 等。
• main.scss - 将上述所有部分组合在一起的输出文件

在示例中，它们同时加载所有文件，但我担心我应该将不同的页面样式和它们的加载分开。

我想问一下是否一次加载所有 .scss 文件不会减慢页面速度？为什么没有提到分离？变量的继承？为什么？

Answer 1

文件分离使开发更容易——当你想要做一个小的改变时不必搜索数百甚至数千行 SCSS 会好得多——但不要担心；它不会减慢您的页面速度。

当 SASS 编译时，它会将 SCSS 文件合并为一个 CSS 文件，并经常同时缩小它。