Akryum / floating-vue

💬 Easy tooltips, popovers, dropdown, menus... for Vue
https://floating-vue.starpad.dev/
MIT License
3.34k stars 336 forks source link

Cannot run in SSR/Vue 3 due to floating-vue components #1056

Open bhaidar opened 4 weeks ago

bhaidar commented 4 weeks ago

Hello,

I am using the package inside a Laravel / InertiaJS project.

Inside the vite.config.js file, I exclude the package as I need it only on the client-side.

 ssr: {
        noExternal: [
            // ...
            'floating-vue',
            // ...
        ]
    },

When I run the inertiajs SSR command via php artisan inertia:start-ssr, then I start the app, I get the following error

ReferenceError: Element is not defined
    at file:///var/www/html/bootstrap/ssr/assets/Navigation-4196422e.js:1090:30
    at ModuleJob.run (node:internal/modules/esm/module_job:234:25)
    at async ModuleLoader.import (node:internal/modules/esm/loader:473:24)
    at async j (file:///var/www/html/node_modules/@inertiajs/vue3/dist/index.esm.js:1:5861)
    at async Server.<anonymous> (file:///var/www/html/node_modules/@inertiajs/core/dist/server.esm.js:1:527)

At line-1095 inside the Navigation component, is this code:

$t = defineComponent({
  name: "VPopperWrapper",
  components: {
    Popper: nt,
    PopperContent: Q
  },
  mixins: [
    Z,
    J("finalTheme")
  ],
  props: {
    // ... 
    container: {
      type: [String, Object, Element, Boolean], **// Line 1095**
      default: void 0
    },
    boundary: {
      type: [String, Element],
      default: void 0
    },

Any idea how to make this work?

Thanks Bill