Rails / Bootstrap 4

概要

Rails で Bootstrap 4 を利用するための初期設定

動作環境

• Rails 5.2.3
• ruby 2.5.5

表記の注意事項

「$」 記号は ターミナルにおける /bin/bash のコマンドプロンプトを表します

「+ 」 (プラスとスペース1字)は、ファイル編集において、追記した行を表します
「- 」 (マイナスとスペース1字)は、ファイル編集において、削除した行を表します

導入手順

Gem

Gemfile

+ gem 'bootstrap', '~> 4.3.1'
+ # Bootstrap JavaScript depends on jQuery. If you're using Rails 5.1+, add the jquery-rails gem to your Gemfile
+ gem 'jquery-rails'

$ bundle install

SCSSマニフェストファイル

CSSマニフェストファイルを SCSSマニフェストファイルに変更

$ git mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss

SCSSマニフェストファイル設定

app/assets/stylesheets/application.scss

-  *= require_tree .
-  *= require_self

   */
+ // Custom bootstrap variables must be set or imported *before* bootstrap.
+ @import "bootstrap";

JSマニフェストファイル設定

app/assets/javascripts/application.js

  //= require turbolinks
+ //= require jquery3
+ //= require popper
+ //= require bootstrap-sprockets
  //= require_tree .

参考

• [e-mail]