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

Laravel Elixir combining Sass files in wrong order

我在同一目录中有三个 Sass 文件:_include.scssapp.scsspartials.scss

app.scsspartials.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 正确插入底部。

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

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

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

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

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