2

I am trying to use a library called KSVG in a Kotlin/JS project. The maintainer has tried to set up K/JS support, but it isn't working correctly. In IntelliJ, I am adding the following repo and dependency to my build.gradle.kts:

repositories {
    jcenter()
}

dependencies {
    implementation(kotlin("stdlib-js"))

    implementation("com.github.nwillc", "ksvg", "2.2.0")
}

There is no error shown, and the IDE appears to properly load the dependency, but it isn't exposed in my codebase at all. Is there a way to see why this dependency is failing? Is there an obvious issue with the library preventing it from working in K/JS?

RedBassett
  • 3,469
  • 3
  • 32
  • 56
  • Do you use the webpack build or do you add dependencies manually to the resulting artefact? (eg. in the index.html) – pixix4 Jul 15 '20 at 13:09
  • Neither, I am trying to access it from my main kotlin package after adding it to the dependency list and syncing gradle, but that may be a misunderstanding as to how K/JS dependencies are included, which is why I am here. – RedBassett Jul 18 '20 at 18:41

1 Answers1

2

K/JS dependencies are similar to K/JVM dependencies. By adding them to the gradle project you use and compile them. But to run the project you need the runtime dependency. The default run task in K/JVM automatically adds the runtime dependencies to the classpath. But if you want to create a jar you have to do this manually or create a fat jar.

In K/JS (for browser, not sure about nodejs) their is no default run task that includes the runtime dependencies. You have to add them manually. Their are two ways to do it.

  1. Manually grep the dependency js files from the runtimeClasspath task
  2. Use the webpack build (similar to the fat jar approach)

Here is a working example for the webpack build. The build task creates the artefacts at ./build/distributions/. (Their is also a run task that starts a server at port 8080)

build.gradle.kts

plugins {
    kotlin("js") version "1.3.72"
}

repositories {
    mavenCentral()
    maven("https://dl.bintray.com/nwillc/maven")
}

dependencies {
    implementation(kotlin("stdlib-js"))
    testImplementation(kotlin("test-js"))

    implementation("com.github.nwillc:ksvg-js:3.0.0")
}

kotlin.target.browser {}

main.kt

import com.github.nwillc.ksvg.elements.SVG
import kotlin.browser.document

fun main() {
    val svg = SVG.svg(false) {
        circle {
            cssClass = "black-stroke"
            id = "face"
            cx = "180"
            cy = "140"
            r = "80"
            fill = "#aa450f"
        }
    }
    document.write(svg.toString())
}
pixix4
  • 1,271
  • 1
  • 13
  • 13
  • Thank you for the explanation of the build process for dependencies. I have used the maven repo method you showed in your sample, but IntelliJ still doesn't recognize any packages starting with the name `com.github` to import, nor can it autocomplete when I type `SVG`. – RedBassett Jul 19 '20 at 18:20
  • 1
    I am not very familiar with ksvg but maybe js support was added with version 3. At least the versions before version 3 do not have splitted dependencies for jvm and js (but that would be typical for multiplatform libraries). So a dependency update could help. I tested the posted code snippets in a clean project so if this doesn't work, I have no idea what it is (with gradle 6.5). – pixix4 Jul 20 '20 at 07:38
  • I missed that you had added the `-js` suffix. I had tested that artifact name before without correct repo declarations, but forgot to switch it back when testing this. Works! Thank you. – RedBassett Jul 21 '20 at 04:28