sass - 如何使用 Elixir 编译目录中的所有 SASS 文件？

Question

我正在使用 elixir 编译我的 scss 文件。

假设这是我的文件夹结构:

- app.scss
- header.scss
- footer.scss
- home/
  - home1.scss
  - home2.scss

对于一个文件，我可以使用 mix.sass('app.scss'); 但是如果对于我目录中的所有文件而不需要一个一个地添加它们呢？

我试过:

mix.sass('*.scss');
mix.sass('**/*.scss');
mix.sass(['*.scss']);
mix.sass(['**/*.scss']);

我唯一能得到的文件是public/css/app.css

我怎样才能编译所有文件以获得如下内容:

- app.scss
- header.scss
- footer.scss
- home/
  - home1.scss
  - home2.scss

Answer 1

我认为通配符解决方案根本行不通。您是否尝试过使用 @import "file2" 导入您的文件依赖项，并且只处理这些文件？

假设:home1.scss

@import "../app"
@import "../header"
@import "../footer"
// home1 css

home2.scss

@import "./home1"
// home2 css

与:

mix.sass('home1.scss');
mix.sass('home2.scss');

您将只生成 home1.css 和 home2.css 以及它们的依赖样式。

通过这种方式，您可以改进代码并更好地控制依赖项。