【初心者】Railsチュートリアル5章でBootstrapが読み込めない人へ

プログラミング

おはこんばんにちは!ノボルです。

最近Railsチュートリアルに取り組んでいるのですが、
5章「レイアウトを作成する」の5.1.2 BootstrapとカスタムCSS
Bootstrapがどうしても読み込めず躓いちゃいました。

QiitaやStack Overflowで紹介されている方法は全て試したのですが、
上手くいかず、結局エラーを解決するまで5日もかかりました。泣
teratailでさっさと聞けばよかったのですが、
どうしても自分で解決したくて粘りまくりました。笑

皆さんには僕のように時間を無駄にして欲しくないので、
この記事で対処法を一挙紹介します!


開発環境を変える

開発環境に何かしらの問題があり、読み込めない場合があるようです。
僕の場合、Cloud9ローカル開発環境に変えたところ、
Bootstrapが上手く読み込めました!
Cloud9で上手くいかなかった理由についてですが、調べても特定できませんでした。
(すみません泣)
どなたか知っている方がいたら、シェアして頂けると幸いです!

Cloud9のインスタンス・rails serverを再起動

これもQiita、Stack Overflowで紹介されていたのですが、
Cloud9などのIDE(総合開発環境)を使っている方は、
インスタンスそのものを再起動することでBootstrapが読み込めることがあるようです。

インスタンス再起動のやり方については以下の記事が分かりやすいです!
https://naito-coding0322.hatenablog.com/entry/2018/10/01/140650

rails serverの再起動↓


Gemfileとcustom.scssの記述を確認

当たり前ですが、Gemfilecustom.scssの記述が間違っていたら、
Boostrapは読み込めません


bundle installの実行

意外とbundle installをしてないのが原因だったりするようです。
もう既にやったという方も、念の為再度実行することをおすすめします。


Gemfileとapplication.jsに追記

Gemfileapplication.js記述を加えることでエラーが解消したという報告もあります。

app/assets/javascripts/application.js↓ 

追記後は、bundle installを忘れないように。

最後に

今回はrailsチュートリアル5章でBootstrapが読み込めないときの対処法をご紹介しました。
もし上記の方法を全て試しても解決しなかったという方は、
ググるか素直にteratailで質問しましょう笑

エラー解決は大変ですが、諦めず一緒にrailsチュートリアルを駆け抜けましょう!

コメント

  1. nagi より:

    Gemfileとapplication.jsに追記、を試したところ上手くいきました!!ありがとうございます…!

    • ノボル ノボル より:

      コメントありがとうございます。
      よかったです!
      エラーで引っかかることがあると思いますが、頑張ってください!

タイトルとURLをコピーしました