Question

我正在尝试学习Rails，在此期间我想让我的页面更加时尚。为此，我继续下载Bootstrap 4并按照我能找到的所有安装说明进行操作。为了测试它，我尝试添加一个简单的导航栏。栏加载所有文本，但没有应用CSS：（

所有bootstrap css和js文件都在assets / stylesheet和/ javascript

中

此时我不太确定我做错了什么或需要改变什么。我猜这很简单。

的Gemfile

gem＆＃39; rails＆＃39;，＆＃39; 4.2.4＆＃39;

宝石＆＃39; execjs＆＃39;

gem＆＃39; sass-rails＆＃39;，＆＃39;〜＆gt; 5.0＆＃39;

gem＆＃39; coffee-rails＆＃39;，＆＃39;〜＆gt; 4.1.0＆＃39;

gem＆＃39; coffee-script-source＆＃39;，＆＃39;〜＆gt; 1.8.0＆＃39;

gem＆＃39; bootstrap＆＃39;，＆＃39;〜＆gt; 4.0.0.alpha6＆＃39;

gem＆＃39; jquery-rails＆＃39;

Application.html.erb

<!DOCTYPE html>
<html>
    <head>
      <title>Test</title>
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
      <%= javascript_include_tag 'application', media: 'all', "data-turbolinks-track" => true %>
      <%= csrf_meta_tags %>

    </head>
    <body>  
    <nav class="navbar navbar">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">Test</a>
    </div>
    <ul class="nav navbar-nav">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="#">Page 1</a></li>
      <li><a href="#">Page 2</a></li>
      <li><a href="#">Page 3</a></li>
    </ul>
  </div>
</nav>
        <div class="container">
            <%= yield %>
        </div>
    </body>
</html>

这是我的 /assets/stylesheets/application.scss

@import＆＃34; bootstrap＆＃34;;

这是我的/assets/javascript/application.js

//= require jquery
//= require bootstrap
//= require bootstrap.js
//= require bootstrap.min.js
//= require jquery-3.1.1.min.js
//= require jquery_ujs
//= require turbolinks
//= require_tree .

谢谢

Answer 1

我想我发现了这个问题。我在gemfile中有两个sass条目

gem 'sass-rails', '~> 5.0'
gem 'bootstrap-sass', '~> 3.3.6'

我评论了sass-rails，一切都开始工作了。

无法使用Bootstrap与Rails应用程序

1 个答案: