我正在尝试在我的css文件中使用boot-strap变量和mixins。下面是需要它们的CSS文件。
#app/assets/stylesheets/dashboard/_common.css.scss
// import the CSS framework
@import "bootstrap-sprockets";
@import "bootstrap-custom";
// make all images responsive by default
img {
@extend .img-responsive;
margin: 0 auto;
}
// override for the 'Home' navigation link
nav.navbar {
border-bottom: 1px solid #eee;
background-color: $body-bg;
}
.....
以下是app / assets / stylesheets / dashboard.css.scss中的一段代码:
*= require _bootstrap-custom
*= require_tree ./dashboard
*= require_self
_bootstrap-custom.scss
已导入所有变量和mixins等。
@import "bootstrap-variables-custom";
@import "bootstrap/mixins";
....
在仪表板文件夹中,我将显式导入bootstrap-custom
和bootstrap-variables-custom
我需要使用它们的地方,尽管它已使用require指令导入dashboard.css.scss
:
*= require _bootstrap-custom
从common.css文件中删除这些导入时,出现以下错误:Undefined variable: "$body-bg".
虽然,我已经完成了here提到的解决方案,但它似乎没有用。