TIL it's rather simple to load scripts dynamically...

# compose-web

[Alex Styl]

TIL it's rather simple to load scripts dynamically in Compose Web

@Composable
fun Script(
    src: String,
    onLoad: () -> Unit = { debugln { "✅ $src loaded" } },
    type: String = "text/javascript",
) {
    LaunchedEffect(Unit) {
        val script = document.createElement("script") as HTMLScriptElement
        script.src = src
        script.type = type
        script.onload = { onLoad() }
        document.head?.appendChild(script)
    }
}

Can be used like this

Script(
        src = "scripts/zip-full.min.js",
        type = "module",
    )

and the script is in the resources folder

[Alex Styl]

Reminds me of NextJs Script component

[ephemient]

if it's in resources then couldn't you just

<script src="scripts/zip-full.min.js" async>

directly in your HTML?

[Alex Styl]

@ephemient I was doing that initially but moving towards having the app (kt) self contained.

I don't use the index.html file (I load the script in my web site) when I deploy my app which makes it trickier to debug (running the gradle command to run the browser app)