-
-
Notifications
You must be signed in to change notification settings - Fork 32
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
Nuxt3 SSR Deployed on netlify #146
Comments
This has popped up before in #92
Locally your server may not be transpiring the So you can stick to using the non-async version of the API and avoid using |
Thanks for the info! |
@logaretm what about the warning: |
I would need an example to check this out, I'm using villus in production without these problems. Can you create an example on codesandbox or a public repo here on GitHub? I will be happy to take a look. |
@logaretm thanks. I did some debugging and I think it might be a bug in netlify but I'm not sure. ❌ in short, this gives me the warning on netlify (also locally with // app.vue
// HERE: import useClient
import { useClient } from 'villus'
export default {
setup() {
console.log("before");
useClient({
...
})
console.log("after");
},
}
} ✅ while this doesn't give any warning. it works 🎉 // app.vue
import { VILLUS_CLIENT, createClient } from 'villus'
// HERE: define manually instead (exact same implementation as Villus's lib)
function useClient(opts) {
const client = createClient(opts);
provide(VILLUS_CLIENT, client); // Villus uses `vue.provide` but otherwise it's identical
return client;
}
export default {
setup() {
console.log("before");
useClient({
...
})
console.log("after");
},
}
} the warning I'm talking about is: [Vue warn]: provide() can only be used inside setup (). I have no idea why this works while the other doesn't 😞 |
This is interesting, which |
Nuxt is auto importing it (directly from vue AFAIK), but just to be sure, I tried to manually import provide from vue directly and it's the same |
I'm thinking that vee-validate and nuxt's vue imports are not pointing to the same Vue dist file. Resulting in two different provide/inject namespaces. Previously with webpack you would solve this by aliasing |
@logaretm I managed to fix the problem, I think you're right. for some reason the library is using a different instance of Vue. I transpiled the lib and it worked just like instructed in this comment m4rvr/storyblok-rich-text-renderer#21 (comment) I did this for all the my dependencies and the build size dropped from |
in the root app I am using
useClient
inside setup like so:and in the page I have
locally everything works fine but when deployed to netlify with SSR I am getting the following error:
The text was updated successfully, but these errors were encountered: