Error when importing Flowbite JavaScript in Electron Vue application

I am building an Electron application with Vue, Tailwind, and Flowbite for components. However, I am encountering an issue when using Flowbite components that rely on JavaScript. I have followed the documentation and installed Flowbite in the project, importing it as follows:

src/main.js:

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import { initFlowbite } from 'flowbite';

import 'flowbite/dist/flowbite.min.css';

import './assets/css/imports.css'

const app = createApp(App)
app.use(initFlowbite)
app.use(router)
app.mount('#app')

./assets/css/imports.css:

@tailwind base;
@tailwind components;
@tailwind utilities;

@import url('animations.css');
@import url('fonts.css');
@import url('reset.css');

tailwind.config.js:

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
    "./node_modules/flowbite/**/*.js"
  ],
  darkMode: true,
  theme: {
    extend: {
      colors: {
        'syer-primary': '#8B5FED',
        'syer-secondary': '#3F88D3',
      },
    },
  },
  plugins: [
    require('flowbite/plugin')
  ]
}

Within this setup, when I run the project, the visual aspects and CSS of the components work normally. However, components requiring JavaScript, such as a modal, do not function as expected. Interestingly, if I make a change and save the src/main.js file, triggering a Vue server reload, the Flowbite JavaScript seems to be imported, and the components work correctly.

I have attempted the following solutions to address the issue:

Import modules separately

import { initFlowbite, /* other necessary modules */ } from 'flowbite';

Import Flowbite JS via CDN in public/index.html

<script src="https://cdn.jsdelivr.net/npm/flowbite@latest/dist/flowbite.min.js"></script>

Directly import Flowbite JS in the component

import 'flowbite/dist/flowbite.min.js';

Create middleware to import Flowbite on all routes when called

// Sample middleware implementation
const flowbiteMiddleware = (to, from, next) => {
  import('flowbite/dist/flowbite.min.js').then(() => {
    // Continue navigation
    next();
  }).catch((error) => {
    console.error('Failed to load Flowbite:', error);
    // Handle error and proceed with navigation
    next();
  });
};

//Vue router middleware implementation
router.beforeEach(flowbiteMiddleware);

None of the above solutions have resolved the issue for me.