在Rails App上安装Bootstrap 3

我正在尝试在我的Rails应用程序上安装Bootstrap 3.0。我最近完成了Michael Hartl的教程，现在正在尝试使用此新版本的Bootstrap构建我自己的系统，但是我有一些不确定的问题。

我的系统规格：

• MBP上的OS X Mountain Lion
• Rails 4.0
• Ruby 2.0

我有问题：

1. 我的Gemfile中使用的最好的宝石是什么？我发现了其中一些。
2. 我要导入什么custom.css.scss？我在某处读到它不同于2.3.2。
3. 要使Bootstrap正常工作，我还有其他事情要做吗，或者其余步骤是否与我对Bootstrap 2.3.2遵循的步骤相同？

编辑

这是GitHub上的bootstrap-rails项目首先要说的：

gem 'anjlab-bootstrap-rails', :require => 'bootstrap-rails',
                              :github => 'anjlab/bootstrap-rails'

然后说要做：

gem 'anjlab-bootstrap-rails', '>= 3.0.0.0', :require => 'bootstrap-rails'

他们做同样的事情，还是必须同时做它们？

实际上，您不需要gem，这是在RoR中安装Bootstrap 3的步骤

• 下载 Bootstrap

• 复制：

  bootstrap-dist/css/bootstrap.css 和 bootstrap-dist/css/bootstrap.min.css

  至： vendor/assets/stylesheets

• 复制：

  bootstrap-dist/js/bootstrap.js 和 bootstrap-dist/js/bootstrap.min.js

  至： vendor/assets/javascripts

• 更新： app/assets/stylesheets/application.css通过添加：

  *= require bootstrap.min

• 更新： app/assets/javascripts/application.js通过添加：

  //= require bootstrap.min

有了它，您可以随时更新引导程序，而无需等待gem进行更新。同样，通过这种方法，资产管道将在生产中使用缩小版本。

众所周知，不需要宝石。

采取的步骤：

1. 下载Bootstrap
   • 直接下载链接Bootstrap 3.1.1
   • 或访问http://getbootstrap.com/

2. 复制

   bootstrap/dist/css/bootstrap.css
   bootstrap/dist/css/bootstrap.min.css 

   至： app/assets/stylesheets

3. 复制

   bootstrap/dist/js/bootstrap.js
   bootstrap/dist/js/bootstrap.min.js 

   至： app/assets/javascripts

4. 附加到： app/assets/stylesheets/application.css

   * =需要引导

5. 附加到： app/assets/javascripts/application.js

   // =需要引导

就这些。您已经准备好添加新的超酷Bootstrap模板。

为什么要app/代替vendor/？

将文件添加到app / assets很重要，因此将来您将能够覆盖Bootstrap样式。

如果以后要添加custom.css.scss具有自定义样式的文件。您将在中拥有与此类似的内容application.css：

 *= require bootstrap                                                            
 *= require custom  

如果您将引导文件放置在app / assets中，那么一切都会按预期进行。但是，如果将它们放在供应商/资产中，则引导文件将最后加载。像这样：

<link href="/assets/custom.css?body=1" media="screen" rel="stylesheet">
<link href="/assets/bootstrap.css?body=1" media="screen" rel="stylesheet">

因此，您的某些自定义设置将不会被使用，因为Bootstrap样式将覆盖它们。

背后的原因

Rails将在许多位置搜索资产；要获取此位置的列表，可以执行以下操作：

$ rails console
> Rails.application.config.assets.paths

在输出中，您将看到应用程序/资产优先，因此首先加载它。

对于那些希望在不使用gem的情况下在Rails应用程序中安装Bootstrap 3的用户，此答案是适用的。有两种简单的方法可以完成此操作，而只需不到10分钟的时间。选择最适合您需求的产品。Glyphicons和Javascript可以正常工作，我也已经在最新的Rails 4.1.0 Beta中对其进行了测试。

1. 将Bootstrap 3与Rails 4一起使用-Bootstrap 3文件被复制到应用程序的供应商目录中。

2. 从CDN将Bootstrap添加到Rails应用程序 -Bootstrap 3文件从Bootstrap CDN提供。

上面的2号是最灵活的。您需要做的就是更改存储在布局助手中的版本号。因此，您可以运行自己选择的Bootstrap版本，无论是3.0.0、3.0.3还是更低版本的Bootstrap 2。

Twitter现在有一个包含了gem 的好用的Bootstrap版本，因此比以往任何时候都更容易将其添加到Rails中。

只需将以下内容添加到您的gemfile中：

gem 'sass-rails', '>= 3.2' # sass-rails needs to be higher than 3.2
gem 'bootstrap-sass', '~> 3.1.1'

bundle install 并重新启动服务器，以使文件可通过管道使用。

还支持罗盘和仅适用于ass的应用程序：https : //github.com/twbs/bootstrap-sass

我使用https://github.com/yabawock/bootstrap-sass-rails

这几乎是直接安装，快速的gem更新和后续操作以及需要时的快速修复。

gem bootstrap-sass

bootstrap-sass很容易通过资产管道落入Rails。

在您的Gemfile中，您需要添加bootstrap-sass gem，并确保存在sass-rails gem-默认情况下将其添加到新的Rails应用程序中。

gem 'sass-rails', '>= 3.2' # sass-rails needs to be higher than 3.2 gem 'bootstrap-sass', '~> 3.0.3.0'

bundle install 并重新启动服务器，以使文件可通过管道使用。

资料来源：http : //rubydoc.info/gems/bootstrap-sass/3.0.3.0/frames

对我来说，最简单的方法是

1）下载引导程序并将其解压缩到 vendor

2）将引导路径添加到您的配置中

config.assets.paths << Rails.root.join("vendor/bootstrap-3.3.6-dist")

3）要求他们

在CSS *= require css/bootstrap

在js中 //= require js/bootstrap

做完了！

此方法使字体加载时无需任何其他特殊配置，并且不需要将引导文件移出其独立目录。

使用此分支有望解决问题：

gem 'twitter-bootstrap-rails',
  git: 'git://github.com/seyhunak/twitter-bootstrap-rails.git',
  branch: 'bootstrap3'

我认为新引导程序版本的最新宝石是anjlab表格。

但是我不知道当您这样做时rails generate simple_form:install --bootstrap，它当前是否可以与诸如simple_form之类的其他gem一起使用，等等。您可能必须编辑一些初始化程序或配置以适应新的引导程序版本。

实际上，我对此有一个简单的解决方法，其中我几乎全神贯注于如何使其工作。哈哈哈！

好吧，首先我下载了​​Bootstrap（已编译的css和js版本）。

然后，我将所有引导css文件粘贴到app/assets/stylesheets/。

然后将所有bootstrap js文件粘贴到app/assets/javascripts/。

我重新加载了页面和wallah！我刚刚在RoR中添加了引导程序！