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

Support for Nuxt 3 #109

Open
R0N1n-dev opened this issue Jun 7, 2023 · 1 comment
Open

Support for Nuxt 3 #109

R0N1n-dev opened this issue Jun 7, 2023 · 1 comment
Labels
Feature request New feature or request

Comments

@R0N1n-dev
Copy link

R0N1n-dev commented Jun 7, 2023

The wave-ui page mentions "Not tested with Nuxt 3".
II have a repo with Nuxt 3 set up with wave UI.
https://stackblitz.com/github/R0N1n-dev/nuxi-wave
But on running the server, it reuns well but for an error about Hydration mismatch as shown in the screenshot below.
And it causes issues with hot-reloading.(have to reload page after saving code sometimes).
Screenshot from 2023-06-07 10-24-04


  • Operating System: Linux
  • Node Version: v18.16.0
  • Nuxt Version: 3.5.2
  • Nitro Version: 2.4.1
  • Package Manager: npm@9.6.7
  • Builder: vite
  • User Config: devtools
  • Runtime Modules: -
  • Build Modules: -

@antoniandre
Copy link
Owner

Hi @R0N1n-dev,
Thanks for the repro.
I have modified the code a little to remove the hydration problem.
https://stackblitz.com/edit/waveui-nuxt3?file=layouts%2Fdefault.vue,nuxt.config.ts,plugins%2Fwave.js

This is still not the ultimate way since Nuxt will try to instantiate Wave UI twice (one time on SSR, one time client side) thus you will see the "Wave UI is already instantiated" warning. this does not matter at all and it will not impact the way Wave UI works since it already makes sure you run only one instance.
So you can completely go like this, but for the sake of doing it right, I will develop a Nuxt module for Nuxt 3 / Vue 3 soon.

@antoniandre antoniandre changed the title Nuxt 3 testing Support for Nuxt 3 Jun 7, 2023
@antoniandre antoniandre added the Feature request New feature or request label Jun 7, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Feature request New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants