Seems like I've ironed out most of the issues I ha...

# javascript

[Edoardo Luppi]

Seems like I've ironed out most of the issues I had with KotlinJS on my POC multiplatform project. Thanks everybody for the help!
I still have some usability problems to report on YouTrack tho, will do that asap.

One last major gripe I have when targeting CommonJS (thanks Electron 😞), is the namespacing.
I've tested developing a VS Code and a Theia extension using the compiled library, and namespacing doesn't result in a good DevEx.
Since package names are mostly JVM-oriented, you end up with a lot of wrapped names. See screenshot.

As I have a lot of free time (I wish), can I workaround this problem by introduced a compiler plugin?
Given issues like https://youtrack.jetbrains.com/issue/KT-53993, is the JS backend usable to rename package fragments? (I think this is what I'd be looking at)

[turansky]

ES module kind?

[turansky]

Also you can remove namespaces via webpack

[Edoardo Luppi]

Hi @turansky! I can't use ES modules because VS Code is based on Electron, and Electron doesn't support ES modules yet.

Also you can remove namespaces via webpack

Oh interesting. So that means I can plug into the Webpack process and change whatever I like?
What about generated TS declarations?

[turansky]

Reexport will work in both cases (JS and TS)

[turansky]

I can’t use ES modules because VS Code is based on Electron, and Electron doesn’t support ES modules yet.

I’m not sure that Electron module kind blocks you.
cc @Sergei Grishchenko

[Sergei Grishchenko]

ES modules and CommonJS modules has interoperability (with some restrictions of course).
1. You can import CommonJS into ESM freely (because CommonJS are sync and ESM are async, e.g. you can use sync functions inside async)
2. You can't import ESM into CommonJS seamlessly (again because CommonJS are sync and ESM are async), but you can use dynamic import in CommonJS
https://sliceofdev.com/posts/commonjs-and-esm-modules-interoperability-in-nodejs
It means even if you use CommonJS library (like Electron), you still can write your own code in ESM.
All this information is theoretical, so for your case you need to examine what Kotlin/JS generates for you.

[Edoardo Luppi]

@Sergei Grishchenko thanks for the info. Will have a look! In the meantime I've been experimenting with bundling using Webpack. In this case the entire dependency chain is transformed into the required module format, even if it was ESM to start with, and it seems to work. Although this makes source maps a bit more difficult to use

[Sergei Grishchenko]

True, it is because Webpack is bundler and it supposes that your browser does not support ESM (for modern browsers it is not true though). So if few modules (it does not matter CJS or ESM) are placed in one bundle chunk, Webpack just wraps them in IIFE for isolation, and for importing one bundle chunk to another Webpack uses XHR + eval (maybe all this can be configured).

[Sergei Grishchenko]

but as far as I know Electron does not work in browser, so if you use Electron you don't need Webpack, your code will be executed in environment, that similar to NodeJS