带有 Rails 5 的 Bootstrap4答案

【问题标题】：Bootstrap4 with Rails 5带有 Rails 5 的 Bootstrap4
【发布时间】：2017-01-13 16:11:22
【问题描述】：

我关注official guide 和this post 没有任何帮助，有人可以对此有所了解吗？ (source on github)

我的宝石文件：

...
#bootstrap
gem 'bootstrap', '~> 4.0.0.alpha3.1'
gem 'sprockets-rails', :require => 'sprockets/railtie'

source 'https://rails-assets.org' do
  gem 'rails-assets-tether', '>= 1.1.0'
end
...

我的应用程序.scss：

@import 'bootstrap-sprockets';
@import 'bootstrap';

我的 application.js：

//= require jquery
//= require tether
//= require bootstrap-sprockets
//= require jquery_ujs
//= require turbolinks
//= require_tree .

我的 application.html.erb：

<!DOCTYPE html>
<html>
  <head>
    <title>DankDist</title>
    <%= csrf_meta_tags %>

    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>

  <body>
    <%= yield %>
  </body>
</html>

最后，我的 index.html.erb：

<h1>Scale#index</h1>
<div class="alert alert-success" role="alert">
    <strong>Well done!</strong> You successfully read this important alert message.
</div>
<p>Hello Worldzz</p>
<p>Find me in app/views/scale/index.html.erb</p>
<%= params[:id] %> <br/>
<%= @id %>

Next Page <%= @page +1 %>

<hr/>
<%= params.inspect %>

我运行了 Bundle，并重新尝试了 rails s，没有任何更改，标题不包含任何样式。

【问题讨论】：

你仍然需要你的 require_tree 。在您的 application.css.scss 中。将 scss 重命名为 css.scss 然后添加 /*= require.... */ 我忘记了其中的字符串。参考stackoverflow.com/a/21643987/3338439
我关注了帖子，还是不行
你不应该使用 bootstrap-sass 吗？
只有Bootstrap2和3需要
哦，是的。嗯，那我不确定。还没有检查引导程序 4。如果没有人回答，我明天去试试，让你知道！

标签： ruby-on-rails ruby twitter-bootstrap twitter-bootstrap-4 bootstrap-4

【解决方案1】：

有一些错误

ScaleController 包含布局错误 - 因此您的 application.html.erb 中的样式表导入不起作用
@import '引导链轮'; Bootstrap 4 gem 不需要

【讨论】：

【解决方案2】：

在 application.js 中，尝试将这两行按如下方式排列，我注意到它对我有用：

//= require jquery
//= require bootstrap-sprockets

【讨论】：