Question

我需要将一个目录中的多个sass文件编译到另一个目录中的多个相应的css文件中。例如：

src/folder1/file1.scss  --compiles to--  public/file1.css
src/folder2/file2.scss  --compiles to--  public/file2.css

这是我正在使用的命令：

./src/*/*.scss ./public

在尝试此操作之前，我正在使用./src/*/*.scss编译所有.scss文件，并在各自的目录中获取相应的.css文件。但是，试图将这些转储到不同的目录中是行不通的。相反，其中一个.scss文件将一个.scss部分导入语句导入.scss文件本身，创建了一个.scss.map文件，之后没有其他任何事情发生。

SASS是否具备此功能？我已经尝试了上述命令的不同变体，偶尔我会看到一个错误，说“公共”和“＃39; public＆＃39;是一个目录，这让我相信SASS不允许目录作为输出。实际上，文档仅提供单个输出文件作为编译SASS的示例（即sass input.scss output.css）。

我使用NPM脚本作为构建工具，所以请不要Grunt，Gulp等。

*还有一点需要注意。我只是尝试使用sass --watch而不是普通的编译命令，它有点像我需要的那样：

sass --watch src:public

我遇到的唯一问题是它不会在公共场所创建仅 css文件。相反，它会在文件夹中创建一个文件夹和.css以及.css.map文件。似乎SCSS将为每个.scss文件添加一个路径，该路径分别对应watch遍历的相对路径。如果它不会创建这个额外的文件夹，这个解决方案将是理想的。

Answer 1

您可以通过指定多个source：output将多个sass文件编译成多个css文件，这些文件由以下空格分隔：

{{1}}

您可以根据需要更改src或输出路径。

Answer 2

你必须告诉sass看你想要输出的文件，就像这样：

您甚至可以将其设置为输出压缩的css文件（.map文件会自动为每个css发生）：

var num, i = 1, array = [];
num = parseInt(prompt("Please enter a number:"));

while (i < num) { 
   if (num % i == 0) {
      array.push(i);
   }
   i++;
}
alert("The factors of " + num + " are: " + array + " and " + num);

我通常会去一个文件，但理论上你可以看到不同的scss文件并将它们编译成单独的css文件，不知道你为什么要这样做？但是可以这样做。

对于您要分组的任何内容，将相关文件导入scss文件，然后将其编译为一个文件，然后重复这些步骤。

（注意：我在Node中运行上述命令的sass gem。）

将多个目录中的多个SASS文件编译为单独的单个目录中的多个CSS文件

2 个答案: