bootstrap.min.js と bootstrap.bundle.min.js の違い

※初心者向けの内容です。

Bootstrap4公式のGet Startedで使用するための手順として、cssの読み込みの他に3行の<script>タグが記述されています。

BootstrapはjQueryの他にpopper.js(ツールチップのコンポーネントのため)というJSライブラリを使用(依存)しています。

そのため、bootstrap.js(またはbootstrap.min.js)以外にpopper.jsやjQueryを読んでね、ということで3行の<script>タグになっています。

この辺りは、冒頭のBootstrapのGet Startedページでは

Our bootstrap.bundle.js and bootstrap.bundle.min.js include Popper, but not jQuery.

と言っています。訳すと、「bootstrap.bundle.js(bootstrap.bundle.min.js)はpopper.jsを含んでいるけど、jQueryは含んでないよ」というところでしょうか。

つまり、bootstrap.min.jsを使用するならばpopper.jsも自前で用意する必要があるわけです(もちろんjQueryも)。

一方で、bootstrap.bundle.min.jsを使用するならばpopper.jsは不要で、jQueryだけ別途用意すれば良い、ということになるわけです。

少し読めば分かりますが、一応メモ。

余談

ちなみにBootstrapのGet Startedにある<script>タグをコピペした場合、jQueryがスリム版と最小限構成のものが記述されているので、自分でカスタマイズする際に普通のjQueryと同じつもりで記述するとjQueryの機能が足りなくてコケる場合があります。

これも気にしてないと嵌まるので注意。

この記事を書いた人

アバター

アルム=バンド

フルスタックエンジニアっぽい何か。LAMPやNodeからWP、gulpを使ってejs,Scss,JSのコーディングまで一通り。たまにRasPiで遊んだり、趣味で開発したり。