Ruby on RailsでBootstrapを導入する方法【手順どおりで簡単に】
- 2019.08.08
- Ruby on Rails
よこのじ(@yokonoji_work)です。
Ruby on RailsでBootstrapを導入する方法をご紹介します。
いくつかのファイルを編集しますが、手順通りに進めていけば簡単にBootstrapを導入することができます。
GemfileにBootstrapを追加する
GemfileにBootStrapと、依存関係にあるjQueryを追加します。
gem 'bootstrap' gem 'jquery-rails'
Gemfileを保存したら、bundle installでgemをインストールします。
$ bundle install
application.scssでBootstrapをインポートする
mvコマンドでファイル名の変更を行います。
mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss
application.cssをapplication.scssに変更したら、application.scssから次の記述を削除します。ファイルの場所は「/app/assets/stylesheets/application.scss」です。
*= require_tree *= require_self
そして、同ファイルにBootstrapをインポートする記述を追加します。
@import "bootstrap";
application.jsを編集する
application.js に次の3行を追加します。ファイルの場所は「/app/assets/javascripts/application.js」です。
//= require jquery3 //= require popper //= require bootstrap-sprockets
これでBootstrapを使えるようになっています。
- 前の記事
Ruby on Rails チュートリアルの要約「第2章 Toyアプリケーション」 2019.06.02
- 次の記事
Ruby on Railsでログイン機能を実装するためのgem「devise」を導入する【Bootstrap化と日本語化 含む】 2019.08.10