通过 Sass / Compass 的页面特定样式

Question

我想使用特定于页面的样式，例如仅应用于联系人页面的contact.css（编译）。

我编译了一个 screen.css，它导入了包含全局变量、自定义 mixins、类等的 _base.css，但问题是如果它包含来自 _base.css 的全局变量，我不能使用 contact.css 样式— 即使在contact.css（链接）之前设置了screen.css，它也总是输出错误。如果我将变量导入到 contact.scss 本身，我就会得到重复的样式。

我该怎么办，如何定位特定页面并在 Sass 中保留全局变量？

谢谢。

Answer 1

创建_globalvariables.scss 并将其导入您需要的位置，包括_base.scss。

对于您的screen.scss（或其他），导入_base.scss，对于只需要变量的contact.scss 等工作表，仅导入_globalvariables.scss。

换句话说，将你的 mixins 和变量保存在一个工作表中，没有任何会直接编译为 CSS 的东西，这样你就可以将它导入到你想要的地方，而不必处理重复的样式声明。