Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problem when using in server side rendered page (regeneratorRuntime is not defined) #56

Open
eric-2d opened this issue Feb 18, 2022 · 11 comments · May be fixed by #80
Open

Problem when using in server side rendered page (regeneratorRuntime is not defined) #56

eric-2d opened this issue Feb 18, 2022 · 11 comments · May be fixed by #80

Comments

@eric-2d
Copy link

eric-2d commented Feb 18, 2022

Description of the bug
Page where popper is in use does not work when server side rendered with following error:
[vite] Internal server error: regeneratorRuntime is not defined at vue3-popper@1.4.1_vue@3.2.26/node_modules/vue3-popper/dist/popper.ssr.js:1951:49

Expected behavior
Expected to work as client side rendered

Additional context
Add any other context about the problem here.
Vite + Vue3 + vite-ssr + vue3-popper@1.4.1

After doing some digging it seems like regeneratorRuntime is related to babel but that's about all I could find.

@SebastianBoergers
Copy link

Got the very same problem here. Gonna look into it a bit more and see if there's any kind of sensible fix to it. Also: Bump.

@LynxTR
Copy link

LynxTR commented May 25, 2022

Is there any update about this? i am seeing same error on my first nuxt3 application.

@qnp
Copy link

qnp commented May 27, 2022

We solved it by forcing the import of the ESM build of the lib :

import Popper from 'vue3-popper/dist/popper.esm'

(with the proper shim declare module 'vue3-popper/dist/popper.esm')

@itsmnthn
Copy link

itsmnthn commented Jun 8, 2022

Same issue

@LynxTR
Copy link

LynxTR commented Jun 8, 2022

@itsmnthn I just switched the package with floating-vue

@itsmnthn
Copy link

itsmnthn commented Jun 8, 2022

qnp's answer solved the issue. Also, wrapping <Popper> with <ClientOnly> solves the issue but it's to much.

@jbaubree
Copy link

@valgeirb any update on this ?

@jbaubree
Copy link

I'm using vite with vite-ssg.
My workaround until vue3-popper supports native ESM is:

// vite.config.ts
  ssr: {
    // Workaround until they support native ESM
    noExternal: ['vue3-popper'],
  },

@jbaubree jbaubree linked a pull request Nov 23, 2022 that will close this issue
@icarusgk
Copy link

I'm using vite with vite-ssg. My workaround until vue3-popper supports native ESM is:

// vite.config.ts
  ssr: {
    // Workaround until they support native ESM
    noExternal: ['vue3-popper'],
  },

Thank you for this conf @jbaubree. If anyone is using Nuxt 3, be sure to add these options under the vite key:

vite: {
  ssr: {
    noExternal: ['vue3-popper'],
  }
}

@juancampuzano
Copy link

juancampuzano commented Mar 30, 2023

Is there an official solution for this issue? I am facing the same error when working with Vue and Vitest.

Installed dependencies:

  • vue@3.2.47
  • vue3-popper@1.5.0
  • vitest@0.27.3
  • vite@4.0.4

At this point, the only solution I found was the one suggested by @qnp
import Popper from 'vue3-popper/dist/popper.esm'

Note: My project doesn't have installed vite-ssg.

@Kasopej
Copy link

Kasopej commented Apr 12, 2024

stilll haooening, switching to esm file works though as stated by @qnp

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

9 participants