多个 SCSS 文件但没有多个导入答案

【问题标题】：Multiple SCSS files but no multiple imports多个 SCSS 文件但没有多个导入
【发布时间】：2014-03-13 22:18:04
【问题描述】：

我使用 Foundation 和 Compass 和 Sass 来创建样式表。在我的scss 文件夹中，我有_settings.scss、app.scss 和特定于每个页面组的文件。例如，客户页面有它自己的样式表和设置。

我想将文件分开，以便于使用并减小文件大小。如果我将所有文件都转移到一个页面中，那将是一种巨大的浪费，因为某些样式只需要在一页上。我的app.scss 具有页面的一般样式，它包含在所有页面中。在那个文件的顶部我有

@import "settings";
@import "foundation";
@import "compass/layout.scss";

这些允许我使用 Foundation 中的 rem-calc 等内置函数。但是，如果我在所有不同的样式表中包含这些样式，我会在包含中得到这些样式的副本。包含foundation 会生成大量样式，我不想重复它们。

如果我不包含这些文件，我就不能使用rem-calc() 之类的东西。如果没有导入行，Compass 编译器将不知道如何处理 mixins 等。

我如何保持我的文件分开，但又不包含多次包含 Compass 和 Foundation 样式表的功能？

【问题讨论】：

【解决方案1】：

创建一个主 .scss 文件 ( app.scss ) 确保您正在观看该文件并将您的各个文件@import 到该主 app.scss 文件中。

然后，您可以在编译后在每个页面中只导入一个文件，而不是拥有相同代码的多个版本。

【讨论】：