I'm experimenting with extracting common logic int...

# multiplatform

[diesieben07]

I'm experimenting with extracting common logic into a common kotlin module, which I then compile to Javascript and want to consume in a typescript project (as an npm module). The dependency via NPM works, but I am unsure as to where I would put my typescript definition files. Tried putting them in jsMain/resources, but those files never show up in the NPM project that's generated by the gradle plugin.

Moreover: I am applying the "multiplatform" plugin in a subproject, but the javascript npm projects are still generated in the top level project build folder and there is also an NPM project generated for the top level project (which does not have the multiplatform plugin!). The NPM project that actually contains my js code is put into build/js/packages/<root project name>-<subproject name>. How can I disable this? I just want a plain NPM project for the javascript code.

[Ilya Goncharov [JB]]

Unforunately, now there is no possibility to include some addtional files to build directory of Kotlin/JS output. All resources are processed in module build directory in processedResources

As for your second question, there is some reasons, why we choose this kind of layout. In case of multiple Kotlin/JS modules, there is only one root node_modules, that are shared betwen all packages without duplication
It is related with how node resolve their modules
We discuss it recently in #javascript
https://kotlinlang.slack.com/archives/C0B8L3U69/p1570548676169100?thread_ts=1570132203.140300&cid=C0B8L3U69

[snrostov]

I am unsure as to where I would put my typescript definition files

@diesieben07, as @Ilya Goncharov [JB] said it is not supported yet. Please create issue in http://kotl.in/issue

also an NPM project generated for the top level project

It doesn't. Top-level package.json is not related to any Gradle project. It just contains list of workspaces that located in build/js/packages and build/js/packages_imported. If you will apply kotlin multiplatform or js plugin to root project, corresponding npm package will be created in build/js/packages, not in build/js.

How can I disable this? I just want a plain NPM project for the javascript code.

We can make special layout for it, but in this cases yarn workspaces and shared npm dependencies will not work for subprojects with this layout. What is your use case? Do you really need it?

[diesieben07]

I don't mind NPM workspaces. But what happens is the following:

|_build <- I get an NPM project here! for the root project AND the `mpp` project.
|_build.gradle // plugin multiplatform and jvm with apply false
|___server
    |___build.gradle // plugin jvm, depends on :mpp
|___mpp
    |___build.gradle // plugin multiplatform
    |___src/commonMain/kotlin
    |___src/jsMain/kotlin
    |___src/jvmMain/kotlin

[snrostov]

There is no way to get multiple NPM projects working together without placing them in some directories with single common package.json. That's why the output of all subprojects are located in the root's project build directory.

[snrostov]

But what happens is the following

To be clear: I understand what it happening and it is as designed for the reasons described above. If we put package.json in mpp/build, then we can't link mpp package.json with other npm projects in your build.

[diesieben07]

I wouldn't mind the npm project in root build. What I do mind is that I get an NPM project for the root gradle project, even though it does not have the MPP or JS plugins applied.

[diesieben07]

Because that makes it so I cannot easily use this code from a typescript (or javascript) project, without having to import {foo} from "my-project/packages/sub-project"

[snrostov]

Can you please share your project?

[snrostov]

(I'm not sure I understand you)

[diesieben07]

I am in a meeting until lunch, but I will share an example project in a few hours.

[diesieben07]

However, is it even desired that you use these generated NPM projects from elsewhere?

[diesieben07]

Or are they merely an implemention detail to make npm dependencies work?

[snrostov]

For now, it is more like implementation detail, yes. But we are planning to support projects with manually created NPM packages too. There is some way to get it working in the current implementation too, but it is hacky: you may create your own package.json in the root (not in root/build) with "workspaces": ["build/js/packages/*", "build/js/packages_imported/*", path-to-you-package-here]. In this way you can just import {foo} from "sub-project"

[snrostov]

import {foo} from "sub-project" will work after manual calling yarn install in root project dir. yarn will link all packages together, so your path-to-you-package-here will able to resolve import {foo} from "sub-project".

[diesieben07]

Thank you, I will do some experimentation with that.

[diesieben07]

I have created an example project here: https://github.com/diesieben07/kotlin-mpp-npm-demo
There are two sub-projects: server is a jvm-based server application. mpp is a multiplatform project that contains the common code (to be shared between the jvm-based server and a typescript frontend).
The typescript frontend should ideally use typescript-friendly build tools (like yarn) and not something like Gradle.

[diesieben07]

I'm open for alternative project-layout suggestions, however I would like to be able to develop the common code and the jvm-based server in one IDE session.

[snrostov]

@diesieben07 Here is an example with a workaround for using Kotlin/JS from pure JS module using current Gradle Kotlin/JS plugin: https://github.com/diesieben07/kotlin-mpp-npm-demo/pull/1. See README.md for more details.

We are planning to support this layout (or something like this) in our Gradle plugin, but probably it will not very soon. There are many things that we want to fix for the simple "getting started" scenarios first...

[diesieben07]

Thank you very much for your work, that looks promising. I will check it out in detail this evening.

[diesieben07]

With some experimentation I was able to get a variant of your solution to work in a way where I can now use the Kotlin code from a Typescript-based Angular Project.
Full steam ahead 😄

Thanks again for your great help.