So I can get two Kotlin/JS module to build and eac...

# javascript

[hellman]

So I can get two Kotlin/JS module to build and each has its own browserRun and browserWebpack tasks. But even if I add a dependency from one to the other I can’t get the JS files from the dependency to be included. Any suggestions?

[Ilya Goncharov [JB]]

Hello, how do you declare dependencies?
Could you share your build scripts or even better some reproducing sample?

[hellman]

https://github.com/ErikHellman/kotlin-js-pwa

[hellman]

This is the project

[hellman]

The main module has the following dependencies:

sourceSets["main"].dependencies {
        implementation(project(":service-worker"))
        implementation(kotlin("stdlib-js"))
        implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core:1.3.2")
        implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core-js:1.3.2")
        implementation("org.jetbrains.kotlinx:kotlinx-serialization-runtime-js:0.13.0")
    }

[hellman]

Both service-worker and main produces a JS file in build/distributions. browserRun task works, but only includes the JS scripts from the module it runs on, not any module it depends on

[hellman]

I think this is actually not supported with the current KotlinJS toolchain. The main module needs to add the an entry configuration for the JS file in all its dependencies, and then have the output filename changed so it generates multiple files.

[hellman]

The current webpack config looks like this for the entry and output:

entry: [
    '/Users/hellman/Sources/Kotlin/kotlin-js-pwa/build/js/packages/kotlin-js-pwa-main/kotlin/kotlin-js-pwa-main.js'
  ],
  output: {
    path: '/Users/hellman/Sources/Kotlin/kotlin-js-pwa/main/build/distributions',
    filename: 'main.js'
  },

[hellman]

But it needs to add an entry for the JS file in the service-worker module as well.

[Ilya Goncharov [JB]]

What gradle command failed? I try to run ./gradlew build and it is built successfully
In main/build/distribution you can find your bundle

[hellman]

I only find main.js there

[hellman]

not service-worker.js

[hellman]

There is no failure, I’m just missing the service-worker.js in the output

[Ilya Goncharov [JB]]

It is all bundled in one javascript file
It is how webpack works, it get entry javascript file and generate one bundle with entry and all of its dependencies including transitive

[hellman]

That makles it impossible to have a Kotlin/JS app with Service Workers 🙂

[hellman]

webpack can output multiple files, or use a plugin to generate a sw.js file

[hellman]

There is a workaround for using a single JavaScript file as a Service Worker, but it isn’t pretty

[Ilya Goncharov [JB]]

Yes, webpack can do it, our gradle plugin now can’t do this integration
You can configure webpack manually as you need via webpack.config.d folder

[hellman]

In this case I should put that folder under main, right?

[hellman]

Anyway, should I file an issue about lack of support for Service Worker support in Kotlin/JS?

[Ilya Goncharov [JB]]

Yes, and in this folder you can create plain js file, where can configure webpack via config variable

config.plugins.push(...)

[hellman]

My current workaround is to catch an exception when I access window. If that happens I know I’m running in a Service Worker

[hellman]

Ok. Will investigate that more

[hellman]

USing a single JS file has the advantage of not having to ship the kotlin std lib twice in JS 🙂

[hellman]

But the try/catch hack is ugly

[Ilya Goncharov [JB]]

Anyway, should I file an issue about lack of support for Service Worker support in Kotlin/JS?

You’re welcome of course! Please describe your use case, it helps us to prioritise some stuff, and what specifically problem is (do you have some compiler problems?)

[hellman]

No compiler problems. The only issue so far is that self is undefined, but I guess that is tricky to solve in Kotlin. If running as a normal script it will be the same as the window object, in the case of a Service Worker it’s a ServiceWorkerGlobalScope

[hellman]

But since I can always use window for the window stuff, I just declare self as a ServiceWorkerGlobalScope myself:

external val self: ServiceWorkerGlobalScope