Question

我有一个非常基本的Ruby on Rails安装。我已经安装了bootstrap-sass gem，在我的Gemfile中有'bootstrap-sass' ~> 2.3.1.0并运行了bundle install。重启所有应用程序。我在应用中有一个style.css.scss文件＆gt;资产＆gt;样式表@imports 'bootstrap';以及响应式。这些风格实际上被拉进了我的应用程序，因为它们为前端设计了风格。但是，当我尝试使用变量或mixin时，我在附加的图像中得到错误，以及IntelliJ告诉我它找不到变量。我是整个过程的新手，所以我只是想了解解决它的必要条件。

我使用的是Ruby 2.0.0和Rails 3.2.13rc2

https://docs.google.com/file/d/0BwMz3RH42HtQb0U1TXdHTVF0QjQ/edit?usp=sharing

@import "bootstrap";

body {
  padding-top: 60px;
}

@import 'bootstrap-responsive';

.footer {
  margin-top: 50px;
  color: $greyLight;

    a {
      color: #e5e5e5;
    }
}

这是一个指向heruko上的实时开发站点的链接，不使用变量：

http://shrouded-ocean-4277.herokuapp.com/

编辑：在我的vendor / assets / stylesheets文件夹中，没有bootstrap文件夹或_mixins或_variables文件。当我将gem放入Gemfile并进行捆绑安装时，是否应该安装这些？

编辑：添加我的github：https://github.com/ChrisSki/omrails

Answer 1

关于您的编辑，bootstrap不在vendor中，而是在位于Ruby安装中某处的.gem文件中。

我最近在this guide之后设置了一个类似的应用程序。我有2个.css.scss个文件，一个includes and overrides parts of bootstrap，另一个包含my application's style（与Bootstrap没有直接关系）。如果你查看第二个文件，你可以看到我导入了bootstrap/variables因为我需要访问一些Bootstrap的变量，它就像一个魅力。

我不明白为什么您的原始屏幕截图会抱怨名为variables的内容，我在您的SCSS文件中看不到...您是否尝试过bootstrap/variables？

修改

我刚刚克隆了您的repo，启动了服务器并入侵了style.css.scss。我认为你在测试中输了一个错字：）

h1 { color: $greyLight; /* Does not work!! */ color: $grayLight; /* Works :) */ }

Answer 2

您应该在导入引导程序之前声明变量，然后可以使用scss中的变量。例如，以下是我在rails应用程序中使用变量的方法：

/************************ CSS Variables ***************************/
$myColor: #0F851C;    

/************************ Import Bootstrap ********************************/
@import 'bootstrap';
body { padding-top: 80px; }
@import 'bootstrap-responsive';

只需在scss顶部定义变量，然后导入bootstrap。然后在你的scss中，你可以使用这样的变量：

#myDiv {
  color: $myColor;
}

希望这有帮助！

IntelliJ 12不会引入Sass变量

2 个答案: