主SASS文件到多个CSS文件

Question

所以我有这种不寻常的情况，可能不是Sassy方式或正确的方式，这就是我要问的原因。

我有一个main.scss，基本上导入所有其他部分和框架说bootstrap。如果我需要的只是一个单一的全局CSS，它可以完美地工作，但我需要不同的css文件用于各种组件和页面。一种选择可能是在每个SASS文件中包含变量和mixin，并编译不同的SASS文件。以下是我没有冒险尝试这条道路的原因 -

1. 这在某种程度上似乎不对，可能有很多有效和自动化的方式。
2. 并非所有内容都由我编码，或者我可能没有选项来安排变量和mixins位置。例如。变量和mixins没有在单独的文件中声明，我可能没有选择重新分解。

我使用的一个选项是使用grunt拆分最终编译的css并将它们放在不同的文件夹中，但随后更改图像和字体路径变得非常麻烦。我不知道如何使用imgmin或这样的实用程序来解决我的问题，我不会使用最有效的方法来实现我想要的。我也希望避免工作流程中出现太多复杂问题。

寻找可以帮助我的一些建议或提示。

Answer 1

我不确定为什么你会说编译多个SASS文件似乎不对。这就是我接近它的方式。

如果您有很多变量和mixins，请将共享的变量放在一个文件中。

<强> _shared.scsc：

$blue: #3b97c6;
$grey: #e6e6e6;

@mixin my_mixin {
  // ...
}

然后只需拥有多个SASS文件（不带下划线，以便单独编译）。

<强> sass1.scss

@import "_shared";

// stuff only for sass-1

<强> sass2.scss

@import "_shared";

// stuff only for sass-2

<强> sass3.scss

@import "_shared";

// stuff only for sass-3

我误解了什么吗？