I'm trying to do web development with KMP. <https:...

# webassembly

[Yoonho Aaron Kim]

I'm trying to do web development with KMP.
https://www.jetbrains.com/help/kotlin-multiplatform-dev/compose-navigation-routing.html
I'm trying to apply navigation based on the above page, but I'm getting an error.
Somebody help me?

When I run my code, it works fine on my android device.
But it doesn't work on the web platform.

[Yoonho Aaron Kim]

source code is here:

package com.aaron.kmp.web

import androidx.compose.foundation.layout.imePadding
import androidx.compose.material.Button
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.rememberNavController
import com.aaron.kmp.web.nav.Home
import com.aaron.kmp.web.nav.TechList
import org.jetbrains.compose.ui.tooling.preview.Preview

@Composable
@Preview
fun App() {
    MaterialTheme {
        val navController = rememberNavController()
        NavHost(
            navController = navController,
            startDestination = Home,
            modifier = Modifier.imePadding()
        ) {
            composable<Home> {
                Button(onClick = {
                    navController.navigate(TechList)
                }) {
                    Text("Go to List")
                }
            }

            composable<TechList> {
                listOf("google", "kotlin", "jetbrain", "android", "jetpack", "kmp", "compose", "flutter", "dart", "apple", "ios").forEach { item ->
                    Text(text = item)
                }
            }
        }
    }
}

I added the dependency:

androidx-navigation-compose = { module = "org.jetbrains.androidx.navigation:navigation-compose", version.ref = "navigation" }

[Oleksandr Karpovich [JB]]

Compose for Android doesn't use skiko, but web does use skiko.

The error means that the skiko version is incompatible. You don't add skiko dependency directly, it's a transitive dependency from Compose libraries.

You can try to update the versions:

Navigation - 2.8.0-alpha10
CM - 1.7.0

[Yoonho Aaron Kim]

oh... thank you.
You mean, should I add compose multiplatform dependency?

my toml file is:

[versions]
agp = "8.2.2"
android-compileSdk = "34"
android-minSdk = "24"
android-targetSdk = "34"
androidx-activityCompose = "1.9.2"
androidx-lifecycle = "2.8.2"
compose-plugin = "1.6.11"
kotlin = "2.0.20"
navigation = "2.8.0-alpha10"
kotlinxSerialization = "1.7.3"

[libraries]
androidx-activity-compose = { module = "androidx.activity:activity-compose", version.ref = "androidx-activityCompose" }
androidx-lifecycle-viewmodel = { group = "org.jetbrains.androidx.lifecycle", name = "lifecycle-viewmodel", version.ref = "androidx-lifecycle" }
androidx-lifecycle-viewmodel-compose = { group = "org.jetbrains.androidx.lifecycle", name = "lifecycle-viewmodel-compose", version.ref = "androidx-lifecycle" }
androidx-lifecycle-runtime-compose = { group = "org.jetbrains.androidx.lifecycle", name = "lifecycle-runtime-compose", version.ref = "androidx-lifecycle" }

# Navigation
androidx-navigation-compose = { module = "org.jetbrains.androidx.navigation:navigation-compose", version.ref = "navigation" }

kotlinx-serialization-json = { module = "org.jetbrains.kotlinx:kotlinx-serialization-json", version.ref = "kotlinxSerialization" }

[plugins]
androidApplication = { id = "com.android.application", version.ref = "agp" }
androidLibrary = { id = "com.android.library", version.ref = "agp" }
jetbrainsCompose = { id = "org.jetbrains.compose", version.ref = "compose-plugin" }
compose-compiler = { id = "org.jetbrains.kotlin.plugin.compose", version.ref = "kotlin" }
kotlinMultiplatform = { id = "org.jetbrains.kotlin.multiplatform", version.ref = "kotlin" }

[Oleksandr Karpovich [JB]]

you have it here: compose-plugin = "1.6.11"

try 1.7.0

[Yoonho Aaron Kim]

Oh... Thank you!

[Yoonho Aaron Kim]

Wow.. it works!
Thank you 🙂

[Andrey Beryukhov]

Is there some compatibility table of Skiko? Or is it a good way to add it as a dependency explicitly?