Open foxilated opened 1 year ago
Note that I have wrapped the component with ClientSideOnly, like this
<ClientOnly> <div class="bg-background-dark/50 top-0 left-0 w-screen h-screen flex flex-col items-center justify-center z-[120]" > <FlipBook class="w-[80vw] h-[70vh] rounded-3xl flex flex-col items-center justify-center" v-slot="flipbook" :clickToZoom="false" :singlePage="false" :gloss="0" :pages="images" v-if="isVisible" > </FlipBook> </div> </ClientOnly>
This is the error
[Vue warn]: Unhandled error during execution of render function at <Flipbook key=0 class="w-[80vw] h-[70vh] rounded-3xl flex flex-col items-center justify-center" clickToZoom=false ... > at <ClientOnly> at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< Proxy { <target>: Proxy, <handler>: {…} } > > at <RouteProvider key="/ar/newspaper" vnode= Object { __v_isVNode: true, __v_skip: true, type: {…}, props: {…}, key: null, ref: {…}, scopeId: null, slotScopeIds: null, children: null, component: null, … } route= Object { fullPath: "/ar/newspaper", hash: "", query: {}, name: "newspaper___ar", path: "/ar/newspaper", params: {}, matched: (1) […], meta: Proxy, redirectedFrom: undefined, href: "/ar/newspaper" } ... > at <RouterView name=undefined route=undefined > at <NuxtPage> at <Default ref=Ref< Proxy { <target>: {…}, <handler>: {…} } > > at <LayoutLoader key="default" layoutProps= Object { ref: {…} } name="default" > at <NuxtLayoutProvider layoutProps= Object { ref: {…} } key="default" name="default" ... > at <NuxtLayout> at <App key=3 > at <NuxtRoot> [deps:1449:13](http://localhost:3000/_nuxt/node_modules/.cache/vite/client/deps/) [Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/core at <Flipbook key=0 class="w-[80vw] h-[70vh] rounded-3xl flex flex-col items-center justify-center" clickToZoom=false ... > at <ClientOnly> at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< Proxy { <target>: Proxy, <handler>: {…} } > > at <RouteProvider key="/ar/newspaper" vnode= Object { __v_isVNode: true, __v_skip: true, type: {…}, props: {…}, key: null, ref: {…}, scopeId: null, slotScopeIds: null, children: null, component: null, … } route= Object { fullPath: "/ar/newspaper", hash: "", query: {}, name: "newspaper___ar", path: "/ar/newspaper", params: {}, matched: (1) […], meta: Proxy, redirectedFrom: undefined, href: "/ar/newspaper" } ... > at <RouterView name=undefined route=undefined > at <NuxtPage> at <Default ref=Ref< Proxy { <target>: {…}, <handler>: {…} } > > at <LayoutLoader key="default" layoutProps= Object { ref: {…} } name="default" > at <NuxtLayoutProvider layoutProps= Object { ref: {…} } key="default" name="default" ... > at <NuxtLayout> at <App key=3 > at <NuxtRoot> [deps:1449:13](http://localhost:3000/_nuxt/node_modules/.cache/vite/client/deps/) Uncaught (in promise) TypeError: Expected a `number[]` with length 6 or 16. NuxtJS 67
Note that I have wrapped the component with ClientSideOnly, like this
This is the error