How to properly load tw-elements in Laravel with Vue project?

Question

I have a Laravel project with Vue.js and I'm trying to use tw-elements by installing it via npm. I have imported the module in my app.js file, but when I try to use it somewhere else, it doesn't work. I don't receive any errors, but the element simply doesn't show up.

Can someone please help me understand what I'm doing wrong and how I can properly use tw-elements in my Laravel project with Vue.js?

Here's my code:

import './bootstrap';
import '../css/app.css';

import { createApp, h } from 'vue';
import { createInertiaApp } from '@inertiajs/inertia-vue3';
import { InertiaProgress } from '@inertiajs/progress';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
import { ZiggyVue } from '../../vendor/tightenco/ziggy/dist/vue.m';
import { autoAnimatePlugin } from '@formkit/auto-animate/vue';
import VueClickAway from "vue3-click-away";
import * as te from 'tw-elements';
const appName = window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel';

createInertiaApp({
title: (title) => ${title} - ${appName},
resolve: (name) => resolvePageComponent(./Pages/${name}.vue, import.meta.glob('./Pages/**/*.vue')),
setup({ el, app, props, plugin }) {
return createApp({ render: () => h(app, props) })
.use(plugin)
.use(autoAnimatePlugin)
.use(VueClickAway)
.use(ZiggyVue, Ziggy)
.use(te)
.mount(el);
},
});

InertiaProgress.init({ color: '#4B5563' });

<template>

  <div class="flex justify-center">
  <div class="mb-3 xl:w-96">
    <select data-te-select-init data-te-select-filter="true">
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
    </select>
  </div>
</div>
</template>
<script>
import AppLayout from "@/Layouts/AppLayout.vue";
import {
    defineComponent
} from "vue";
import {
    directive
} from "vue3-click-away";
import {
    Inertia
} from "@inertiajs/inertia";
import JetInputError from "@/Components/InputError.vue";
import {
    Link
} from "@inertiajs/inertia-vue3";
import {
    reactive
} from "vue";
import {
    useAutoAnimate
} from '@formkit/auto-animate/vue';

export default defineComponent({
    directives: {
        ClickAway: directive
    },
    props: {
        plans: Array,
    },
    components: {
        AppLayout,
        JetInputError,
        Link,
        useAutoAnimate,
    },
    data() {
        return {}
    },
    setup() {
        const form = reactive({});

        function submit() {
            Inertia.post(route("reservas.store"), form, {
                onSuccess: () => {
                    this.openForm = false;
                }
            });
        }
        return {
            form,
            submit
        };
    },
    mounted() {},
    methods: {

    }

});
</script>

I made this change because I received a message: "No declaration file found for module 'tw-elements'. 'index.min.js' in 'c:/sites/ReservationSystem/node_modules/tw-elements/ dist/js/' has an implicitly 'any' type.", I wanted to try if