Dynamic Data not working on (vercel?)

When I pass the data to Content or RenderContent:

<Content model={DYNAMIC_SECTION} content={content} apiKey={apiKey} data={salesRepData} context={salesRepData} />

Everything seems to be working fine on localhost and through builder.io, but on live web site deployed on vercel, that dynamic data is missing, it’s visible if viewing live site through builder.io but not when viewing live site.

Checking the server logs I see:

[Builder.io]: Custom code error in non-node runtime. SDK can only execute ES5 JavaScript. {
e: SyntaxError: “undefined” is not valid JSON
at theFunction (code:7:12)
at code:11:0
}

I found a genius solution after many attempts:

because obviously show if Builder.isBrowser didn’t work for me, but I see that the issue is vercel ssr not allowing eval functions you guys are using, so the solution is to have inside the qwik side a check for isbrowserside:

const isBrowserMode = useSignal<boolean>(false)

useVisibleTask$(() => {
    isBrowserMode.value = true
})

then we conditionally render that shit:

        <Resource
            value={builderContentRsrc}
            onPending={() => <div>Loading...</div>}
            onResolved={(content) =>
                content &&
                (isBrowserMode.value ? (
                    <Content model={DYNAMIC_SECTION} content={content} apiKey={apiKey} data={salesRepData} />
                ) : (
                    <Content model={DYNAMIC_SECTION} content={content} apiKey={apiKey} />
                ))
            }
        />

Hopefully, this helps someone!

NOTICE: You cannot use any kinda show if builder…etc stuff this way, or so it seemed to crash the localhost server.

1 Like