Laravel9とVue3で環境構築をしたので、その手順をまとめました。

Laravelのインストール

まずはLaravel9をインストールします。

command

composer create-project laravel/laravel:^9 example_app --prefer-dist

できたプロジェクトをVSCodeなどで開きます。
そのターミナルで以下のコマンドを叩き、Laravelを起動します。

command

php artisan serve

するとターミナルに以下のようなメッセージが出てくるので、今回で言うとhttp://127.0.0.1:8001/にアクセスします。
（Failed to listen on 127.0.0.1:8000 (reason: Address already in use). と出ている私の環境では、他のプロジェクトも立ち上げていたので127.0.0.1:8000は使えずhttp://127.0.0.1:8001を使うよ。と言っています。）

アクセス先の画面がLaravelの画面になっていたら成功です。

次に、phpMyAdminでDBを作成してください。
（今回はこちらの詳細は割愛します）

そして初期設定として.env（必要に応じてconfig/database.phpも）とconfig/app.phpファイルを修正し、デバッグバーも入れておきます。

まずは.envとconfig/database.phpでDBに接続できるように修正します。
（私の場合はエラーが出たのでこちらを参考にしています）

.env

APP_NAME=Laravel
APP_ENV=local
APP_KEY=base64:vet1oesu5/ebZ0N5G1zVyEwZp9THivmJlRmmyjD2sjE=
APP_DEBUG=true
APP_URL=http://localhost // 変更

LOG_CHANNEL=stack
LOG_DEPRECATIONS_CHANNEL=null
LOG_LEVEL=debug

DB_CONNECTION=mysql
DB_HOST=localhost
DB_PORT=3306
DB_DATABASE=[phpMyAdminで設定したDB名]
DB_USERNAME=[phpMyAdminで設定したユーザー名]
DB_PASSWORD=[phpMyAdminで設定したパスワード]
DB_SOCKET=/Applications/MAMP/tmp/mysql/mysql.sock　// 追加

BROADCAST_DRIVER=log
CACHE_DRIVER=file
FILESYSTEM_DISK=local
QUEUE_CONNECTION=sync
SESSION_DRIVER=file
SESSION_LIFETIME=120

MEMCACHED_HOST=127.0.0.1

REDIS_HOST=127.0.0.1
REDIS_PASSWORD=null
REDIS_PORT=6379

MAIL_MAILER=smtp
MAIL_HOST=mailpit
MAIL_PORT=1025
MAIL_USERNAME=null
MAIL_PASSWORD=null
MAIL_ENCRYPTION=null
MAIL_FROM_ADDRESS="hello@example.com"
MAIL_FROM_NAME="${APP_NAME}"

AWS_ACCESS_KEY_ID=
AWS_SECRET_ACCESS_KEY=
AWS_DEFAULT_REGION=us-east-1
AWS_BUCKET=
AWS_USE_PATH_STYLE_ENDPOINT=false

PUSHER_APP_ID=
PUSHER_APP_KEY=
PUSHER_APP_SECRET=
PUSHER_HOST=
PUSHER_PORT=443
PUSHER_SCHEME=https
PUSHER_APP_CLUSTER=mt1

VITE_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
VITE_PUSHER_HOST="${PUSHER_HOST}"
VITE_PUSHER_PORT="${PUSHER_PORT}"
VITE_PUSHER_SCHEME="${PUSHER_SCHEME}"
VITE_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"

config/database.php

'mysql' => [
            'driver' => 'mysql',
            'url' => env('DATABASE_URL'),
            'host' => env('DB_HOST', '127.0.0.1'),
            'port' => env('DB_PORT', '3306'),
            'database' => env('DB_DATABASE', 'forge'),
            'username' => env('DB_USERNAME', 'forge'),
            'password' => env('DB_PASSWORD', ''),
            'unix_socket' => '/Applications/MAMP/tmp/mysql/mysql.sock', // 変更
            'charset' => 'utf8mb4',
            'collation' => 'utf8mb4_unicode_ci',
            'prefix' => '',
            'prefix_indexes' => true,
            'strict' => true,
            'engine' => null,
            'options' => extension_loaded('pdo_mysql') ? array_filter([
                PDO::MYSQL_ATTR_SSL_CA => env('MYSQL_ATTR_SSL_CA'),
            ]) : [],
        ],

そして以下コマンドでDBにテーブルを作成します。

command

php artisan migrate

以下のようにphpMyAdinでテーブルが生成されていたら成功です。

次はconfig/app.phpファイルでタイムゾーン、言語設定を設定します。

config/app.php

'timezone' => 'Asia/Tokyo',
'locale' => 'ja',
'fallback_locale' => 'ja',
'faker_locale' => 'ja_JP',

最後にデバッグを楽にするためにデバッグバーをインストールしておきます。

command

composer require barryvdh/laravel-debugbar

先ほどのLaravel画面に以下のようにデバッグバーが表示されると成功です。

Vue3をインストール

まずBreeze（vue）をインストールします。

command

composer require laravel/breeze:^1 --dev
php artisan breeze:install vue
npm install && npm run dev

以下のようにVITEが立ち上がれば成功です。

以上でLaravel9とVue3の環境構築は終了です。
お疲れ様でした！

何か誤りなどございましたらご指摘いただけますと幸いです。