hi，i want use dependencies from npm，which write wi...

# compose-web

[zfan93]

hi，i want use dependencies from npm，which write with js like below ：

// Include Lightbox 
import PhotoSwipeLightbox from '/photoswipe/photoswipe-lightbox.esm.js';

const lightbox = new PhotoSwipeLightbox({
  // may select multiple "galleries"
  gallery: '#gallery--getting-started',

  // Elements within gallery (slides)
  children: 'a',

  // setup PhotoSwipe Core dynamic import
  pswpModule: () => import('/photoswipe/photoswipe.esm.js')
});
lightbox.init();

How do I define it in kotlin with @JsModule("") ？This seems a lot more complicated than the example on the website....Many thanks！！🫡

[zfan93]

That's all I can write

@JsModule("photoswipe/lightbox")
external class PhotoSwipeLightbox(){
    fun init()
}

val lightbox =PhotoSwipeLightbox()
    lightbox.init()

[David Herman]

I'm not sure I can help you too much, but I do appreciate that the docs are a bit simple. Did you know you can annotate a package and not just a class?

[David Herman]

I'm just starting out myself, and I'm not sure my code is worth imitating yet, but here's an example of something I'm doing:

https://github.com/bitspittle/firebase-kotlin-bindings/blob/8fbf7d2f5ecf3941ebe4ce[…]sMain/kotlin/dev/bitspittle/firebase/externals/app/Externals.kt

[zfan93]

something like this？

@file:JsModule("extModule")
package ext.jspackage.name

external fun foo()

external class C

[David Herman]

Yeah. I think the details of the Kotlin package itself doesn't matter, but you're saying that all external declarations in that package should map to classes, methods, etc. in the NPM module you're importing.

[David Herman]

You may also need to annotate the package with @file:JsNonModule because 🤷 I don't know why, the compiler said I had to 🙂

[zfan93]

Thank you very much. Very useful. I need to study it

[Big Chungus]

I've written this up a while ago to help people get started with js wrapping https://dev.to/mpetuska/js-in-kotlinjs-c4g

[David Herman]

Awesome post, thanks! Wish I found it earlier!