为什么变量在库中的单独scss文件中定义

Question

我最近为新项目做过SCSS。我在twitter bootstrap或materializecss等库中注意到的一件事是，他们已经将所有变量转储到单个_variables.scss文件中的所有组件中。删除相应组件scss文件中的变量有什么问题？不能使代码更加独立吗？是这样的SCSS不允许吗？

Answer 1

我认为这样做的原因是为开发人员简化这些变量的编辑。它也是在不同组件之间共享公共属性的好方法，例如强调色。

我自己也在我的项目中使用这种方法，创建一个environment.scss文件，其中包含所有属性的地图，颜色，字体，大小或任何东西。这样，如果我想要更改这些值，则只需要修改一个文件，并且它们也可以在组件之间轻松共享。

Answer 2

之所以如此，是因为，如果您导入类似物料的包，并且想要从项目文件中的按钮（如$ button-width或其他）访问变量，则必须导入该特定文件（_button.scss）。如果你需要使用另一个变量，比如$ popover-background，你也必须导入它！。

所以你会有很多进口，它的丑陋和困难，这就是为什么你应该把所有的变量保存在一个文件中，所以你只需要导入1个文件来访问它，加上它，更多人类可读，简单，快速编辑单个文件。

但主要是导入1个文件。在复杂的项目中，你会有很多文件，而且它们真的不干净，有很多进口。