What I tried:
-
I tried work around it via
if (browser)
, more specifically{
if (!browser) { let DailyIframe = await import('daily-co/daily-js) }
in the load function inside<script context="module">
) so the code is always executed on the server). Then pass it as a prop to a component. However, although it worked on the server, the local dev environment re-runs the load function (which has to return an empty prop as it never imported anything) and overrides DailyIframe’s value (might be a bug with Vite/SvelteKit). -
I tried to import the library in an end-point e.g.
api.json.js
instead, which is always executed on the server. However, it has to return a json, and I can’t pass an entire library variable onto it.
After research
It seems like a combination of problems from Vite, SvelteKit and certain libraries where global
is undefined: SvelteKit With MongoDB ReferenceError: global is not defined)
But I cannot use his solution of putting it in an endpoint, because I need the DailyIframe and the mic audio stream from the client to create a video conference room
Also, why would certain libraries Daily (and looking at other related Stackoverflow posts, MongoDB) throw this error in the first place, while other libraries are safe to use?
Anyway suggestion is appreciated!