EGO-LOG

40代2児の父。主にプログラム学習と開発、仮想通貨、メタバース、たまに関係ないことを綴る。

Laravel.35 Bootstrapインストール

前回

tenomeuonome.hateblo.jp

は、gitに苦戦した(現在進行形)だけの回。

 

■環境

Windows10

Laravel9

■Bootstrapインストール

現状はlaravelのbladeファイルから直接URLを指定して参照している。

これでも動作はするが、毎回ネットワーク越しに動作することになるのでローカルで参照できるようインストールしたい。

karaagelovers.com

LaravelではLaravel UIというフロントエンド用のパッケージが用意されています。
パッケージではVue、React、Bootstrapが対応していて、
それぞれのフレームワークを簡単にインストールまたは利用することができます。

 

■Composerコマンド実行

$composer require laravel/ui

laravel/ui のバージョン3.4がインストールされた。

 

■Bootstrapインストールとビルド

$php artisan ui bootstrap

 

$npm install && npm run dev

 

■動作確認

http://127.0.0.1:8000/css/app.css にアクセスしてcssが参照できればインストール成功

 

 

blade.php

ヘッダーの記述を

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"・・

から

<link href="{{ asset('css/app.css') }}" rel="stylesheet">

に変更。

既存の画面を再表示して、変化がない(厳密にはちょっと変わった)のと、

ブラウザの開発者モードでcssが参照できてるのを確認。

 

今回はここまで

 

続く