2018.01.11

Laravel 5.5 で Bootstrap 4 を使う

Laravel 5.5 は、初期状態では Bootstrap 3 が組み込まれています。これを Bootstrap 4 に変更する方法をご紹介します、、、

  1. package.json の編集
    bootstrap-sass を削除、bootstrap, popper.js を追加
  2. resources/assets/js/bootstrap.js の編集
    require('boostrap-sass') を require('boostrap') に変更
  3. resources/assets/sass/_variables.scss の編集
    $font-size-base を削除
  4. resources/assets/sass/app.scss の編集
    @import "~bootstrap-sass/assets/stylesheets/bootstrap"; を @import "~bootstrap/scss/bootstrap"; に変更

bootstrap-sass は、3.x系しかないので、4.x にするために、bootstrap パッケージをインストールする必要があります。また、Bootstrap 4 から popper.js が必要になったのでそれも追加しましょう(jQuery は初期状態で Laravel に組み込まれているのでここでは触れていません)

以上です。
あとは npm install, npm run dev コマンドで Mix を実行し、アセットのコンパイルが通ることを確認してください。