I have an existing KMP project, with web (using ko...

# javascript

[Stylianos Gakis]

I have an existing KMP project, with web (using kotlin-react-wrappers), iOS and Android targets. I want to add another target that is a normal react project using TS as a module which would consume my “shared” module. Is there some sort of guide for this particular use case? Couldn’t find anything in the docs, only using Kotlin for the frontend as well 🤔

[Big Chungus]

https://github.com/mpetuska/npm-publish/tree/master/sandbox/ts-consumer

[Stylianos Gakis]

I don’t think I am following this structure in general. I am used to having the classic KMP structure of

> ios
> android
> desktop
> shared
> web-kotlin
> web-ts[wanna add this here]

This is the project I am playing with for example.

Is the only way to consume such shared code through this npm publish that you linked? I am not planning to publish the shared code publicly as a library, but have it in a mono-repo, just like how the iOS target simply gets the shared dependency from the shared module but aside from that is a standalone project.

[Big Chungus]

Have a better look at how ts-consumer I've linked is setup. Nothing needs to be published for you to run it

[Stylianos Gakis]

Yeah sorry, I’m in a bit unfamiliar grounds so seeing things a bit off of what I am used to make it hard to understand 😅 I’ll try and take a much closer look, thanks!

[Big Chungus]

No problem

[Stylianos Gakis]

Out of curiosity I see that this is a custom gradle plugin made by you, probably solving some problems that I haven’t encountered myself in order to understand why it exists in the first place.
Does that mean that out of the box there is no solution for this provided by Jetbrains, therefore you filled that gap with this. Or is it maybe that the alternatives are problematic/less ergonomic in some ways?
If I know why I am opting in to something I can also explain to my colleagues why I am doing so. I would really appreciate if you find the time to say regarding this to help me understand 🙏

[Big Chungus]

Oh the plugin is entirely optional for this setup. I've initially written it as a maven-publish alternative for publishing kotlin.js libraries to npm. However since the plugin assembles the publications before publishing, it's also quite convenient to use just for getting said publications ready to be consumed locally without ever publishing them. You can just as well assemble the publications yourself with a custom gradle task.

[Big Chungus]

Hope that's clear enough for you 😀

[Big Chungus]

Key points of ts-consumer for you should be what files get assembled, where and how they're eventually linked to a ts project. How the publication is assembled is not all that important.

[Stylianos Gakis]

Wow well I think I am on the right path, doing this commit seems to have things working now!
I could at least run buildAndStart and have the console print the shared greeting code! Not sure how much of the stuff in the commit is necessary to make this work or if I over-copy pasted stuff but it’s a start!

Out of curiosity, is this @JsExport annotation the only way to have things be exposed to the client? It seems like I couldn’t access those without it.

Ah this is exciting, I feel like I know nothing all over again now 😂

[Big Chungus]

@JsExport is mandatary for IR backend. It does nothing for LEGACY backend, but with that you miss out on generated ts declarations.

[Stylianos Gakis]

Aha, and as I understand I am using the IR backend, therefore all the stuff I need to also be consumed by JS will just have to be annotated that way, alright.

[Big Chungus]

Correct.

[Big Chungus]

I've left a comment on your commit. Otherwise looks good.

[Sebastien Leclerc Lavallee]

That’s exactly what I have and want to do but didn’t have the time to test npm-publish 😅 Glad to see it’s working for you and makes me working happy

[Big Chungus]

Hah, it working on CI is not convincing enough? 😄

[Sebastien Leclerc Lavallee]

I got it working using npm-publish. Thanks!!