Bootstrap modal doesn't work in laravel js file

Hello. I'm using Laravel 9, I've installed Bootstrap, Tailwind, jQuery with Vite. Here is my vite.config.js file:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import path from 'path'

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/sass/app.scss',
                'resources/js/app.js',
            ],
            resolve: {
                alias: {
                    '~bootstrap': path.resolve(__dirname, 'node_modules/bootstrap'),
                    '$': 'jQuery'
                }
            },
            refresh: true,
        }),
    ],
});

Here is my app.js file:

import './bootstrap';
import '../sass/app.scss';
import * as bootstrap from 'bootstrap';
import jQuery from 'jquery';
window.$ = jQuery;
import swal from 'sweetalert2';
window.swal = swal;

In app.blade.php, I've added with vite the js files.

@vite(['resources/sass/app.scss', 'resources/js/app.js', 'resources/css/tailwind.css'])
    @vite(['resources/js/functions.js'])
    @include('sweetalert::alert')

When clicking on a button, I've created a route where I'm returning a view where is my modal. But in my functions.js file, the function .modal('show') is not recognized

$("#show-data").on('click', function(){
    $.ajax({
        type: "POST",
        url: '/getMyPersonalData',
        headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
        data: {
            unic: $('#unic-data').val()
        },
        success: function (response) {
            $("#show-personal-data").html(response.html);
            $("#personalModal").modal("show");
           
        },
        fail: function (response) {
            console.log("fail");
        }
    });
});

In the console, I have the following error: functions.js:12 Uncaught TypeError: $(...).modal is not a function It seems that the bootstrap is not loaded, but it is. Do you have any ideas how can I fix it? Thanks.