Rails/Bootstrap4/Rails5.2に導入の変更点

追加された行はこの色です。
削除された行はこの色です。
Rails/Bootstrap4/Rails5.2に導入へ行く。
Rails/Bootstrap4/Rails5.2に導入の差分を削除

#author("2022-02-03T08:34:46+00:00","default:src128","src128")
&tag(Rails/Bootstrap4/Rails5.2に導入);
*目次 [#a19c714c]
#contents
*関連ページ [#s803f860]
*参考情報 [#z4d74724]

*Bootstrap4を導入(Rails 5.2編) [#ye2b2012]

**参考情報 [#m35bf134]
-[[twbs/bootstrap-rubygem: Bootstrap 4 rubygem for Rails / Sprockets / Hanami / etc:https://github.com/twbs/bootstrap-rubygem]]…公式サイト
-[[Railsアプリで Bootstrap 4 を利用する - Qiita:https://qiita.com/NaokiIshimura/items/c8db09daefff5c11dadf]]

**Gemfileの編集 [#i5e663fa]
-Gemfileに以下を追加。
#pre{{
gem 'bootstrap', '~> 4.1.1'
gem 'jquery-rails'
}}
-sprockets-railsがv2.3.2以降であることを確認(Rails 5.2だとデフォルト対応済みか?)
 bundle show |fgrep sprockets-rails


**application.scssの作成 [#f4729296]
-application.scssを作成する。
 @import "bootstrap";

**application.html.erb [#m2426b17]
-これは特に変更なし？
#pre{{
<!DOCTYPE html>
<html>
  <head>
    <title>Rails5Bootstrap4Demo</title>
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>

    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>

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

}}


**kaminariの対応 [#bd45688b]
-[[bootstrap4が適用されたkaminariのviewを作成したい - その辺にいるWebエンジニアの備忘録:https://kossy-web-engineer.hatenablog.com/entry/2018/11/14/061534]]
 bundle exec rails g kaminari:views bootstrap4

Rails/Bootstrap4/Rails5.2に導入 の変更点

Rails/Bootstrap4/Rails5.2に導入の変更点