javascript as target in kotlin multiplatform library

Question

I'm building a Kotlin multiplatform library. One of the targets in this project is javascript. In the source set I have added a dependency like this:

 val jsMain by getting {
        dependencies {
            implementation(npm("libphonenumber-js", "1.10.13"))
        }
    }

The gradle sync was successful, now I want to import the files in jsMain directory. How can I achieve this?

Do you want to know how to use JS code form Kotlin? https://kotlinlang.org/docs/js-interop.html — aSemy, Aug 26 '22 at 10:11

score 0 · Answer 1 · answered Aug 26 '22 at 10:48

0

You have to use js(IR) backend and generate externals implementation(npm("libphonenumber-js", "1.10.13", generateExternals = true)).

answered Aug 26 '22 at 10:48

vanyochek

815
4
10

I have added this. Now, how to import the library in the kotlin class inside jsMain? For example for ios we have use like `import cocoapods.libPhoneNumber_iOS.*` – Anmol Singh Sahi Aug 26 '22 at 11:59
You can just use it e.g. `findNumbers("")`. – vanyochek Aug 29 '22 at 09:53

shaktiman_droid · Accepted Answer · 2022-08-26T14:11:38.350

0

Add npm dependency with generateExternals as you already did implementation(npm("libphonenumber-js", "1.10.13", generateExternals = true))
generateExternals = true triggers a tool called Dukat that generates Kotlin external declarations from the Typescript definition file of that npm module.
Once your project syncs, it would have externals folder under your shared module's build folder like shown below,

(Ignore kmp-lib-1621 in above image. That would be your module/library name instead)`

Now copy and paste these files in your project (jsMain source set) and remove generateExternal = true from your dependency otherwise it would generate this files everytime. (1) you would lose any manual change (2) if you update the library version then it can potentially break your project

You should be able to call generated external code from Kotlin code, whether you keep it in build folder or you pasted it in your project code.

Important Note: Dukat tool is experiemental and known to create externals that may not work 100% times. So remove all unnecessary code from external generated code so you only end up having few references of classes you want to use from the npm library. Do some trial and error and you would be fine.

Hope this helps!

edited Aug 26 '22 at 14:11

answered Aug 26 '22 at 14:06

shaktiman_droid

2,368
1
17
32

Thank you Shaktiman. What would be the right way to import the files. As far as I can see in the generated files, there are a bunch of external functions. So, in my kotlin file I'm importing like `import isPossibleNumber as possibleNumber import isValidNumberForRegion as validNumberForRegion` is there any better way to import? – Anmol Singh Sahi Aug 27 '22 at 03:01
Once you've external generated code, it's just normal `Kotlin` code, so you can use it how you would normally import a Kotlin reference. If you're new to Kotlin, then this document may help with understanding imports. https://kotlinlang.org/docs/packages.html – shaktiman_droid Aug 27 '22 at 16:36
for the below dependency, the external files are not getting generated. What could be the reason? `implementation(npm("google-libphonenumber", "3.2.30", generateExternals = true))` – Anmol Singh Sahi Aug 29 '22 at 08:55
@AnmolSinghSahi because that library doesn't have `Typescript` definition. Dukat needs `Typescript` definition to generate externals. That said, `DefinitelyTyped` repo has support for that package. Use this package instead to generate externals https://www.npmjs.com/package/@types/google-libphonenumber. Keep original npm dependency as well. – shaktiman_droid Aug 30 '22 at 02:42

javascript as target in kotlin multiplatform library

2 Answers2