Laravel Elixir 以错误的顺序合并了 Sass 个文件

Question

我在同一目录中有三个 Sass 文件：_include.scss、app.scss 和 partials.scss。

app.scss 和 partials.scss 都在第一行导入：

@import "include";

并且在 _include.scss 的第一行：

@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";

我的 gulpfile.js 看起来像这样：

var elixir = require('laravel-elixir');
elixir(function(mix) {
    mix.sass([
        'app.scss',
        'partials.scss'
    ]);
});

Bootstrap 和我自己的 Sass 代码合并到同一个 CSS 文件中（public/css/app.css)。唯一的问题是 Bootstrap' s CSS 插入在 app.scss 之后，因此如果它们发生冲突，我所做的任何更改都将被 Bootstrap 覆盖。partials.scss 正确插入底部。

这是什么原因造成的？据我所知，我在其他项目中有完全相同的设置而没有这个问题。

Answer 1

错误在于双重@import "include";语句：

Both app.scss and partials.scss have an import at the first line

SASS中有issue for import once语义，但仍未解决。在问题解决之前，我建议只将库包含在一个地方。

更新：关于该主题还有一个 informative blog post，这可能会帮助您找到适合您的解决方法。

Laravel Elixir 以错误的顺序合并了 Sass 个文件

Laravel Elixir combining Sass files in wrong order

laravel

sass

laravel-elixir