Using image with Kotlin and React

Question

I created this webpage with create-react-kotlin-app. The xml is different than I'm used to and I'm really struggling using a logo that is in the same directory as index.kt. How can I fix this?

package index

import react.dom.*
import kotlin.browser.*

fun main(args: Array<String>) {

    val rootDiv = document.getElementById("root")

    render(rootDiv) {
        img(src="./logo.jpg"){}
    }
}

Haven't worked on create-react-kotlin-app recently, but try moving your image in your src/resources folder. (That is even if you have one) — andylamax
– andylamax, Commented Mar 1, 2019 at 7:02
Thanks, but didn't work. I didn't have the resources folder, but I created it. Tried src="logo.jpg", src="./resources/logo.jpg" and src="./../resources/logo.jpg" (index.kt is inside folder inside src folder). I also tried moving index.kt out so it's just under the source folder, but couldn't get it to work that way either. — luremus
– luremus, Commented Mar 1, 2019 at 9:01
try img(src=require("./logo.jpg")){} and reference your image correctly — andylamax
– andylamax, Commented Mar 1, 2019 at 9:15

luremus · Accepted Answer · 2019-03-01 10:09:27Z

1

Ok, I found a solution simply by taking a look at the create-react-kotlin-app default content, a little awkward.

package index

import react.dom.*
import kotlin.browser.*

@JsModule("src/resources/logo.jpg")
external val logo: dynamic

fun main(args: Array<String>) {

    val rootDiv = document.getElementById("root")

    render(rootDiv) {
        img(src = logo){}
    }
}

Unnecessarily cumbersome if you ask me.

answered Mar 1, 2019 at 10:09

luremus

214 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using image with Kotlin and React

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related