laravelのホームのログイン認証の画面のCSS, JSが反映されない（もしくは空）なのをどうすればよいでしょうか。

Laravelにてホームからログインするときのログイン認証の画面のデザインが崩れています。

本来ならこのような画面になるそうです。

npm,node.js,laravel/ui,bootstrap,viteを導入しています。

package.jsonの中身は以下の通りです。

package.json
1{
2    "private": true,
3    "scripts": {
4        "dev": "vite --host",
5        "build": "vite build",
6        "watch": "vite -- -- watch"
7    },
8    "devDependencies": {
9        "@popperjs/core": "^2.10.2",
10        "axios": "^0.25",
11        "bootstrap": "^5.1.3",
12        "laravel-vite-plugin": "^0.4.0",
13        "lodash": "^4.17.19",
14        "postcss": "^8.1.14",
15        "sass": "^1.32.11",
16        "sass-loader": "^11.0.1",
17        "vite": "^2.9.11"
18    }
19}
20

resources/views/layouts/app.blade.php

app.blade.php
1<!doctype html>
2<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
3<head>
4    <meta charset="utf-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1">
6
7    <!-- CSRF Token -->
8    <meta name="csrf-token" content="{{ csrf_token() }}">
9
10    <title>{{ config('app.name', 'Laravel') }}</title>
11
12    <!-- Scripts -->
13    <script src="{{ asset('js/app.js') }}" defer></script>
14
15    <!-- Fonts -->
16    <link rel="dns-prefetch" href="//fonts.gstatic.com">
17    <link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
18
19    <!-- Styles -->
20    <link href="{{ asset('css/app.css') }}" rel="stylesheet">
21</head>
22<body>
23    <div id="app">
24        <nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm">
25            <div class="container">
26                <a class="navbar-brand" href="{{ url('/') }}">
27                    {{ config('app.name', 'Laravel') }}
28                </a>
29                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}">
30                    <span class="navbar-toggler-icon"></span>
31                </button>
32
33                <div class="collapse navbar-collapse" id="navbarSupportedContent">
34                    <!-- Left Side Of Navbar -->
35                    <ul class="navbar-nav me-auto">
36
37                    </ul>
38
39                    <!-- Right Side Of Navbar -->
40                    <ul class="navbar-nav ms-auto">
41                        <!-- Authentication Links -->
42                        @guest
43                            @if (Route::has('login'))
44                                <li class="nav-item">
45                                    <a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
46                                </li>
47                            @endif
48
49                            @if (Route::has('register'))
50                                <li class="nav-item">
51                                    <a class="nav-link" href="{{ route('register') }}">{{ __('Register') }}</a>
52                                </li>
53                            @endif
54                        @else
55                            <li class="nav-item dropdown">
56                                <a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre>
57                                    {{ Auth::user()->name }}
58                                </a>
59
60                                <div class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdown">
61                                    <a class="dropdown-item" href="{{ route('logout') }}"
62                                       onclick="event.preventDefault();
63                                                     document.getElementById('logout-form').submit();">
64                                        {{ __('Logout') }}
65                                    </a>
66
67                                    <form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">
68                                        @csrf
69                                    </form>
70                                </div>
71                            </li>
72                        @endguest
73                    </ul>
74                </div>
75            </div>
76        </nav>
77
78        <main class="py-4">
79            @yield('content')
80        </main>
81    </div>
82</body>
83</html>

resources/css/app.cssの中身は空です。
resources/css/app.js

app.js
1import './bootstrap';

resources/css/bootstrap.js

bootstrap.js
1window._ = require('lodash');
2
3try {
4    require('bootstrap');
5} catch (e) {}
6
7window.axios = require('axios');
8
9window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';