Hi everyone, I'm new to Kotlin/JS and don't have ...

# javascript

[sunnat629]

Hi everyone,

I'm new to Kotlin/JS and don't have much experience with JS. Currently, I'm exploring Kotlin Multiplatform (1.9.22) and attempting to work with Kotlin/JS as well.

My main goal is to utilize the converted JS file from an existing JS file. If anyone could provide a simple example, that would be fantastic. I've gone through the documentation, but I might have missed something.

(Codes have been moved to the thread)

Could anyone help me understand where I might have gone wrong or offer any feedback? Also, are there any sample codes I could review? Best regards...

[sunnat629]

I have a Kotlin class in shared module

@OptIn(ExperimentalJsExport::class)
@JsExport
class MathOp {
    fun add(a: Int, b: Int): Int = a + b
    fun sub(a: Int, b: Int): Int = a - b
}

build gradle shared module

js(IR) {
        moduleName = "shared"
        browser {
            webpackTask {
            }
            testTask {
                useKarma {
                    useSafari()
                    useFirefox()
                    useChrome()
                    useChromeCanary()
                    useChromeHeadless()
                    webpackConfig.cssSupport { enabled.set(true) }
                }
            }
        }
        binaries.executable()
    }

in jsMain>kotlin>App.js is working

fun main() {
...
val timelineElement = document.getElementById("timeline")
    timelineElement?.textContent = result
...
}

I want to use the converted function in jsMain>resources>main.js and execute in index.html. But somehow I can connect my shared.js?

[turansky]

You can build ES module

With ES modules:

<script type="module">
    import { MathOp } from './shared.mjs'

    MathOp.add(...)
<script>

[Artem Kobzar]

Also, I have a repo with an example of sharing different parts between Kotlin applications (Ktor and Jetpack Compose) and JavaScript. You can jump in between the branches to see different levels of the code-sharing.