2017-03-15 11 views
0

私はRailsを学びたいと思っています。この間、私は自分のページを少しスタイリッシュにしたかったのです。そうするために、私は先に進んでブートストラップ4をダウンロードし、私が見つけることができるすべてのインストール手順に従った。私はそれをテストするために、簡単なナビゲーションバーを追加しようとしました。バーロードのすべてのテキストの罰金が、それ:(Railsアプリケーションで動作するようにブートストラップを取得できない

すべてのブートストラップCSSやJSファイルに適用されるいかなるCSSはありませんが、私はあまりにもわからないこの時点での資産/スタイルシートであり、/ javascriptの

何I間違っているのか、何を変更する必要があるのです。私はそれは単純なものである推測しています。

Gemfile

宝石 'レール'、 '4.2.4'

宝石 'execjs'

宝石 'SASS-レール'、 '〜> 5.0'

宝石 'コーヒーレール'、 '〜> 4.1.0'

宝石 'コーヒー・スクリプト・ソース'、「〜> 1.8.0'

宝石 'ブートストラップ'、 '〜> 4.0.0.alpha6'

宝石 "jqueryの-Railsの

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 "ブートストラップ" です。

これは私の/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 . 

である私は、私が問題を見つけたと思うあなた

+0

あなたの 'application.js'から重複する' require'ステートメントを削除する必要があります。 jqueryとブートストラップを複数回ロードしています。 @Uday kumar dasが言ったように、 'bootstrap'の代わりに' bootstrap-sprockets'をロードしていることを確認してください。 javascriptコンソールにエラーがありますか? –

+0

重複を削除しましたが、何も変更されていません。私も '@import" bootstrap-sprockets "を最初のapplication.scssファイルに追加しましたが、何もしませんでした。 – user974873

答えて

0

ありがとうございます。 は、私はSASS-レールをコメントアウトし、すべてが仕事を始め

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

gemfileで2つのSASSエントリを持っていました。

関連する問題