railsアプリケーションのブートストラップは.scssでしか動作しません

Question

現在、Railsを学習しており、簡単なSocialMedia/Blogアプリケーションで作業しています。 私は、基本的なビューを設定して、そこにBootStrap CSSを適用しようとしているところです。

私は自分のアプリケーションにブートストラップを適用しようとする中、次の手順に従っ：

1）gemfileに宝石「ブートストラップ-SASS」を追加し、

2「をバンドルがインストール」走ったが）*」を追加しました

：=は// =は

4） を添加application.jsする 'ブートストラップ必要「

3）を添加application.cssする' ブートストラップ必要私は、アプリを開くだろうというとき210

<div class="container"> 
    <%= yield %> 
</div> 

はしかし、私は私がアプリケーションに拡張子を変更したとき

couldn't find file 'bootstrap' with type 'text/css' 

それは、ライン「* =ブートストラップが必要です」しかし

を強調うというエラーを得ました。 css.scssはと、以下のように@import文を追加それは、ブートストラップで働い適用

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, or any plugin's 
* vendor/assets/stylesheets directory 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 other CSS/SCSS 
* files in this directory. Styles in this file should be added after 
the last require_* statement. 
* It is generally better to create a new file per style scope. 
* 
*= require_tree . 
*= require bootstrap 
*= require_self 
*/ 
@import "bootstrap"; 

2つの質問...
1.）BootStrapを動作させるために私のアプリが.scssと@importを必要とするのはなぜですか？

2.）なぜ私の "=ブートストラップが必要"は " = require_bootstrap"である必要がありますか？

THANKS !!

Answer 1

Bootstrap-sassは、本来Lessで書かれているブートストラップCSSのSass実装です。

あなたはだけ少ないCSSをしたい場合は、bootstrap-sassを使用して保存しておきたい場合は、getbootstrap.com

からそれを得ることができます。

• あなたのapplication.cssapplication.scssに名前を変更する必要があります。
• *= require bootstrapを削除します。
• 次のように行を追加します。 @importで始まります。
• また、bootstrap-sprocketsを含めることもできます。

これは私の働いてブートストラップアプリケーションのapplication.scssファイルがどのように見えるかです：

... 
* 
*= require_self 
*/ 
@import "bootstrap-sprockets"; 
@import "bootstrap"; 
... 

マイapplicaiton.js

... 
// compiled file. 
// 
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details 
// about supported directives. 
//  
... 
//= require bootstrap-sprockets 
... 

チェックアウトこの参照https://launchschool.com/blog/integrating-rails-and-bootstrap-part-1/区分のRailsでのブートストラップの統合というタイトルで。

Answer 2

application.css.scss：

*= require bootstrap #remove it 
*= require_self 
*= require_tree . 
*/ 

application.js

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

そして、最も重要な新しいSCSSファイル開いていて、追加します。

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