将主SASS文件转换为多个CSS文件

Question

将主SASS文件转换为多个CSS文件

3

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

我有一个main.scss文件，基本上导入所有其他局部文件和框架，比如bootstrap。如果我所需要的只是一个单一的全局CSS，那么它完美地工作，但我需要不同的CSS文件来应对各种组件和页面。一个选项是在每个SASS文件中包含变量和mixin，并编译不同的SASS文件。以下是我没有尝试这条路的原因：

1. 这样做似乎不太对，可能有更有效率和自动化的方法。 2. 并非所有东西都由我编码，或者我可能没有选择将变量和mixin位置排列好。例如，变量和mixin未在单独的文件中声明，我可能没有重构的选择。

我正在使用的一个选项是使用grunt分割最终编译的css并将它们放置在不同的文件夹中，但更改图像和字体路径却成为了一个大问题。我不确定如何使用imgmin或类似的实用程序来解决我的问题，也不确定我是否使用了最有效的方法来实现我想要的目标。我还想避免在工作流程中出现太多复杂性。

寻求一些建议或提示，可以帮助我解决问题。

- fusionstrings

看起来你的工作流程非常错误，你不需要改变Sass的行为，而是需要调整你的工作流程。 - pankijs

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- manishie · Answer 1

我不确定为什么你会说编译多个SASS文件似乎不对。这是我的做法。

如果你有很多变量和mixin，请将共享的放入单个文件中。

_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

我有什么误解吗？