Rails app:在Twitter Bootstrap中使用gem与包含源代码

时间:2013-04-07 21:46:49

标签: ruby-on-rails twitter-bootstrap gem gemfile

我已经浏览了我的应用程序,当我通过gem包含它时,我很难找到Twitter Bootstrap源的确切位置。如果我想查看Bootstrap .css,我该如何找到它?

另外,据我所知,将它作为一个宝石包括下载并直接包含来源,对吗?一种方法比另一种更好。

最后,如果我想修改Bootstrap css,最好的方法是什么?如果我在我的应用程序中有源,我想我可以去那里修改一些东西。如果我把它作为宝石包括在内怎么样?

对于如何运作这一点的一些澄清将不胜感激。将源代码放在我的应用程序目录中某个地方是有意义的,我可以指向它相对于.html文件...但是使用Gemfile我觉得事情是在一个小黑盒子里......

2 个答案:

答案 0 :(得分:14)

我绝对同意将Bootstrap文件放在应用程序之外是没有意义的。

在这种情况下,我建议使用以下工作流程:

  1. 从Github克隆回购bootstrap-sass或下载zipball。它是Bootstrap进入Sass的官方端口,它由同一个团队保持更新。

  2. 将Sass部分(文件名以下划线开头的部分)复制到app/vendor/assets/stylesheets。 Javascript和图像进入app/vendor/assets下的各自目录。这将提醒您远离编辑这些文件,同时保持应用程序的资产目录清洁。每当你想仔细看看它们时,它们就会在眼前。

  3. bootstrap.scss复制到app/assets/stylesheets并根据需要修改这些内容。请务必关闭您未使用的所有功能,因为携带这些功能意味着拥有比您需要的更大的CSS文件。

  4. 自定义Boostrap变量和类,并在清单中的Bootstrap文件之后加载它们,就像使用gem一样。例如,假设您将自己的变量放入_overrides.scss。您的application.css.scss将如下所示:

    @import "bootstrap";
    @import "overrides";
    
  5. 就是这样。这就是app/vendor/assets的目的!

答案 1 :(得分:2)

我对RoR比较新,发现有几种不同的方法来实现bootstrap。我尝试了宝石thomas-mcdonald / bootstrap-sass并让它工作得很好。 但我希望更深入地了解引导程序文件的作用以及代码的外观。 上面的答案非常有帮助。 我只想补充一点,这个bootstrap 3 video被证明是非常有用的,对我有用。