bootstrap
Rails5

Ruby on Rails5.1.3にBootstrapを導入する方法

More than 1 year has passed since last update.


はじめに

Ruby on Rails5.1.3でtwbs/bootstrap-sassを導入すると

syntax errorが出たので、別の方法を試してみました。

「エラーなんて出なかったよ」って方は、コメントお願いします。


導入方法


  • まず、bootstrapjQueryを導入します。


Gemfile

gem install jquery-rails   # Rails5移行必ず導入する

gem install jquery-ui-rails # 上と同様
gem install bootstrap



  • 次にapp/assets/stylesheets/application.scssを作成します。


ターミナル

>touch app/assets/stylesheets/application.scss

### application.cssは不要なので削除してください ###
>rm app/assets/stylesheets/application.css





  • app/assets/stylesheets/application.scssに以下の内容を記述します。


application.scss

@import "bootstrap";





  • app/assets/javascripts/application.jsに以下を記述します。


application.js

//= require jquery3

//= require popper   //popper.jsに依存しているので導入しています。
//= require bootstrap-sprockets


結果

Boostrap CDNを使った方が楽かも