Trying to make JS run with a custom index.html file in a Multiplatform configuration. `build.gradle....

# javascript

[Chilli]

Trying to make JS run with a custom index.html file in a Multiplatform configuration.
build.gradle.kts :

plugins {
    kotlin("multiplatform") version "1.5.10"
}

group = "me.chilli"
version = "1.0"

repositories {
    mavenCentral()
}

kotlin {
    // ... [JVM config here]
    js(IR) {
        browser {
            webpackTask {
                sourceMaps = true
            }
            commonWebpackConfig {
                cssSupport.enabled = true
            }
        }
    }

    // ...

    sourceSets {
        // ...
        val jsMain by getting
        // ...
    }
}

And then trying to run it using gradlew browserDevelopmentRun but it gives me:

FAILURE: Build failed with an exception.

* What went wrong:
Task 'browserDevelopmentRun' not found in root project '...'.

[turansky]

jsBrowserDevelopmentRun

[turansky]

Also you can find all tasks in Gradle toolbar

[turansky]

Group - Browser

[Chilli]

Yes, I can't see any tasks with browser in the name @turansky..
No idea if I should add another dependency, plugin, or what do to at all to make them appear

[turansky]

Possibly you miss binaries.executable() (if IR compiler used)

[Chilli]

It does make it kinda work—it hosts the index.html file, but how do I run code with that? Can't see any Kotlin inside the /build/processedResources directory, but I guess I gotta include it in the HTML file somehow?

[turansky]

Do you need test page for your example?

[Chilli]

(I'm of course trying to run the Kotlin compiled to JS on the frontend side)

[Chilli]

In my /src/jsMain I have a kotlin directory with a main.kt file, and a resources directory with an index.html file. The browser sees the index.html file, but I have no idea how to make main.kt run on the frontend

[Chilli]

I presume an example page with Kotlin/JS on frontend would be helpful

[turansky]

Like this one?

[turansky]

You can find your run dir in PROJECT_ROOT/build/js/packages/...

[Chilli]

Oh, so the JS file name is just the project name, could've guessed that

[Chilli]

Thanks a lot!

[turansky]

Oh, so the JS file name is just the project name

Use moduleName to configure file name

[turansky]

To have fixed file name

[turansky]

JS file name is just the project name

It’s true only for root project

[Chilli]

I wasn't planning on using modules/subprojects/however they're called, but actually that may be a good idea.
I presume it is possible to have one module as a dependency of another one? Is there any Kotlin documentation/tutorial about this whole “subprojects” thing?

[Chilli]

Also, what are the default JS names for non-root projects?

[turansky]

They are non-fixed 🙂

[Chilli]

Is there any way to make such a configuration with browserDevelopmentRun faster to refresh when editing the HTML/CSS resource files? On every change I have to re-run it, it compiles, and then it opens a new tab for me instead of using the previous one

[andylamax]

browserDevelopmentRun -t

[CLOVIS]

You can pass -t or --continuous to Gradle so it updates the current tab when you edit stuff. For multi-module builds, you can just follow the usual Gradle tutorials (Kotlin doesn't add anything special). You can have JS modules that depend on multiplatform modules, etc.

[andylamax]

also, are you the same Chilli? the one with the youtube channel on 3D Graphics and Game Developement?

[CLOVIS]

The JS file name is the name of the module

[Chilli]

@andylamax I do have a YouTube channel, but I'm pretty sure it's not the one you're thinking of—I barely have anything there 😆