如何为我的 rails 应用程序使用 bootstrap？

Question

我刚刚按照 RailsBridge 教程部署了我的第一个 rails 应用程序。我也遵循了如何将 bootstrap 添加到应用程序的教程，但我被卡住了，因为它要求您使用 TOUCH 命令，而我运行 Windows 没有等效的触摸命令。说明如下：

在命令中输入以下内容：

touch app/assets/stylesheets/bootstrap_and_overrides.css.scss

然后，它会告诉您打开它创建的文件并输入以下内容：

@import "bootstrap";
body { padding-top: 60px; }
@import "bootstrap-responsive";

我刚刚从一个空文本文件手动创建了文件，然后按照其余说明进行操作。如果您好奇，这里有一个 link 的说明：http://docs.railsbridgecapetown.org/intro-to-rails/add_bootstrap 我收到以下错误：

显示 C:/Sites/railsbridgejan/suggestotron/app/views/layouts/application.html.erb 第 7 行出现：找不到文件 'bootstrap'（在 C:/Sites/railsbridgejan/suggestotron/app/assets/stylesheets/application.css :15)

这是第 7 行所说的内容

<%= stylesheet_link_tag "application", :media => "all" %>

另外，我不确定要下载哪个Bootstrap，所以我就把三个都下载了。我是否必须将这些文件移动到特定位置？在教程中它得到了 gem 'bootstrap-sass'。

编辑
Omar 的解决方案有效，但我认为由于没有安装 node.js，我遇到了另一个问题。这是我的新错误：

显示 C:/Sites/railsbridgejan/suggestotron/app/views/layouts/application.html.erb 其中第 7 行提出：

在“...trap-sprockets”之后无效 CSS：预期的选择器或 at-rule 是“@import "bootst..." (在 C:/Sites/railsbridgejan/suggestotron/app/assets/stylesheets/application.scss:21) 提取的源代码（第 0 行附近）：

Answer 1

你好，我会尝试在 Windows 上分享我当前 rails 申请中的内容：

首先，我不确定您为什么必须使用那个 TOUCH 命令，我不记得在我的应用程序中使用过它。我将尝试向您展示我的一些重要文件包含的内容，以便您可以指导自己并尝试找到解决此问题的方法。

  #Gemfile
    gem 'bootstrap-sass', '~> 3.3.1.0'



    #app/stylesheets/application.css.scss
    /*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *= require 'masonry/transitions'
 *= require 'masonry/infinitescroll'
 *= require_tree .
 *= require social-share-button
 *= require jquery.tagsinput
 *= require jquery.minicolors
 *= require font-awesome
 *= require_self
 */


    @import "bootstrap-sprockets";
    @import "bootstrap";

    #.../layout/application.html.haml
    #this goes right below %head
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true
    = javascript_include_tag 'application', 'data-turbolinks-track' => true

    #app/javascripts/application.js
    //= require bootstrap-sprockets

Answer 2

我最近遇到了这个问题，尝试按照以下说明解决了这个问题：

1-在您的 /assets/stylesheets 中创建一个新文件并命名为 custom.css.sass

2-将此部分添加到 custom.css.sass 文件的顶部

@import "bootstrap-sprockets"; @import "bootstrap";

3-保存

一切顺利。

问题出在我的 custom.css.scss 文件扩展名中。使用scss是错误的，当我将其更改为sass时，一切都解决了。

祝你好运！

如何为我的 rails 应用程序使用 bootstrap？

How do I use bootstrap for my rails application?

ruby-on-rails-4

twitter-bootstrap-3