css - Sass 约定

Question

这是一个关于 sass 最佳实践的问题。

假设我有一个 _colors.scss 文件，其中包含变量分配，例如：

 $white : #ffffff;
 $black : #000000;

我有一个使用颜色变量的 _typography.scss 文件：

 H1 {
 color: $white;
 }
 h2 {
  color : $black;
  }

在 styles.scss 文件中：

我这样导入：@import "colors"; @import "排版";

我的想法是，在 screen.scss 文件中，您首先要导入颜色，然后是排版。由于首先导入了颜色，因此这些变量可用于排版和屏幕。

有人告诉我，你必须在 _typography.scss 和 styles.scss 中都导入 _colors.scss。那不是多余的吗？

Answer 1

不久前，我在 Rails 的资产管道中遇到了一些问题，我必须在其他所有样式表中导入 mixin/variable 样式表，才能在 Heroku 上正确预编译。我不知道这个问题是否仍然存在，或者只是我的配置有问题，但是如果你可以在主样式表中只导入一次文件，并且它在开发中工作，并且可以编译，那么我认为可以肯定地说您不必将其包含两次。

Answer 2

不需要导入两次。

我建议使用 project_variable.scss 文件，在其中声明将在项目中使用的所有变量。在 main.css 的开头导入它（在其中导入 _colors et _typo）。

Answer 3

你的想法是正确的。导入变量后，只要在调用变量之前完成，其他 @import 就可以使用它们。

你应该看看“如何构建一个 sass 项目”。它很有帮助