QImg hydration errors in lazy-loaded components #12025
Unanswered
Tosh79
asked this question in
CLI - SSR mode
Replies: 1 comment 1 reply
-
@Tosh79 were you able to find a solution for this? Facing similar issue |
Beta Was this translation helpful? Give feedback.
1 reply
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hi everybody,
currently I am evaluating quasar in ssr / pwa mode to be used with contentful cms. Everything is running smooth so far, except the QImg-Component, which generates client hydration errors. I assume it has something to todo with my components being lazy-loaded.
It's quite easy to reproduce the problem.
Step 1: Create two components "Foo.vue" and "Bar.vue", both simply integrating a qImg:
<template> <q-img src="https://placeimg.com/500/300/nature" /> </template>
(Those components are identical. I just created two, to make sure, that there is not obscure double-import-reason for the error).
Step 2: Create a third component or even a page "Home.vue", that integrate these components. "Foo" being normally imported / locally registered, "Bar" being lazy-loaded/registered via defineAsyncComponent():
Calling this page in an ssr/pwa-context generates following console-warning in the browser twice:
I don't know, if I am missing something and would really be happy, if someone could help me out.
Best regards!
Tosh
Beta Was this translation helpful? Give feedback.
All reactions