11
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

[Rails6] Bootstrapが適用されない時の解決方法

Last updated at Posted at 2021-04-13

##前提・使用環境
AWS Cloud9 (Ubuntu)
Ruby 2.6.6
Rails 6.1.2.1
##エラー内容
以下を元に設定するも、自環境ではBootstrapのドロップダウンのリンクが表示されなかった。
Rails 6にjQueryとBootstrapを入れる(webpackerで入れる場合で進めた)

・実行したコマンド

Terminal
yarn add bootstrap@next jquery popper.js

※ Bootstrapに関してはリンク先と異なるコマンドを実行している1

・ブラウザーに表示されたエラー

Browser
Uncaught Error: Cannot find module '@popperjs/core'

##解決策

Teminal
yarn add @popperjs/core

##エラーの原因・背景など
###エラー認識の経緯
Bootstrapのドロップダウンが表示されなかったので、ブラウザの検証で確認。以下のエラーが発生していた。

Browser
Uncaught Error: Cannot find module '@popperjs/core'

意訳:"@popperjs/core moduleが見つけられないよ"
ということだったのでYarnで上記モジュールをインストールした。(popperjs/popper-core - GitHub)

###参照先
Bootstrap 5.0 - Download - Yarn

###あとがき
今回がQiita初投稿です。至らぬ点・ご指摘ございましたらコメントいただけますと幸いです。

  1. Bootstrapのバージョンによって変わるらしい。導入予定のBootstrapのバージョンのドキュメントに合わせた。

11
2
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?