Laravel Elixir 以错误的顺序合并了 Sass 个文件
Laravel Elixir combining Sass files in wrong order
我在同一目录中有三个 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
正确插入底部。
这是什么原因造成的?据我所知,我在其他项目中有完全相同的设置而没有这个问题。
错误在于双重@import "include";
语句:
Both app.scss
and partials.scss
have an import at the first line
SASS中有issue for import once语义,但仍未解决。在问题解决之前,我建议只将库包含在一个地方。
更新:关于该主题还有一个 informative blog post,这可能会帮助您找到适合您的解决方法。
我在同一目录中有三个 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
正确插入底部。
这是什么原因造成的?据我所知,我在其他项目中有完全相同的设置而没有这个问题。
错误在于双重@import "include";
语句:
Both
app.scss
andpartials.scss
have an import at the first line
SASS中有issue for import once语义,但仍未解决。在问题解决之前,我建议只将库包含在一个地方。
更新:关于该主题还有一个 informative blog post,这可能会帮助您找到适合您的解决方法。