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's и мой собственный код Sass объединяется в один и тот же файл CSS (public/css/app.css). Единственная проблема заключается в том, что CSS Bootstrap вставлен после app.scss, поэтому любые изменения, которые я делаю, будут перезагружены Bootstrap, если они столкнутся. partials.scss вставлен правильно в нижней части.

В чем причина этого? У меня, насколько я понимаю, такая же настройка в других проектах без этой проблемы.

Answer 1

Ошибка заключается в удвоенном @import "include"; заявление:

Оба app.scss и partials.scss есть импорт на первой линии

Существует Н. issue for import once семантика в SASS, но она до сих пор не решен , Я бы предложил включить библиотеку только в одном месте, пока проблема не будет решена.

Обновление: Существует также informative blog post по этой теме, что может помочь вам найти обходное решение, которое вам подходит.