android-studio - 如何将 JS 目标添加到 KMM 项目？

Question

我有一个 AndrodiStudio KMM 项目，我想添加一个 JS 目标。
鉴于 JS 开发仅在 IntelliJ 中可用，我希望我必须在 IDEA 中打开项目添加一个“模块”——但我什至不知道选择哪个——它们似乎都不是“正确”适合:

在 Gradle 部分，有“用于浏览器的 Kotlin/JS 和“Kotlin/JVM”。添加“Kotlin/JS”会破坏*整个项目的 Gradle 构建。“Kotlin/Multiplatform”听起来不像我想要的我已经有了“共享”模块(虽然它不包括 JS)

在 Kotlin 部分，有“KS | IDEA”。显然，我不想将基于“IDEA 构建系统”的内容添加到基于 gradle.kts 的项目中。

所以我的问题是:

哪个模块模板是在“iosApp”和“androidApp”(在 AndroidStudio 或 Idea 中？)旁边添加“jsApp”(或 webApp)的最佳起点？

我需要向“shared/build.gradle.kts”添加什么来支持“jsMain”和“jsTest”文件夹？是否有不同/更好的起点(例如，Github 上涵盖所有平台的教程或最小的“helloWorld”示例)？

我的代码当前结构与Android Studio中的KMM项目模板1:1对应: https://github.com/stefanhaustein/komponents
*) 错误信息:

Error resolving plugin [id: 'org.jetbrains.kotlin.multiplatform', version: '1.4.31']
> Plugin request for plugin already on the classpath must not include a version

Answer 1

通过创建一个新的 Kotlin/JS 项目并将其复制到 jsApp 使其工作在KMM项目中(平行于iosApp等)最小值jsApp/build.gradle.kts似乎是:

plugins {
    kotlin("js")
}

dependencies {
    implementation(project(":shared"))
}

kotlin {
    js() {
        browser {
        }
    }
}

在 shared/build.gradle.kts ，我需要将以下代码段添加到 kotlin 部分(与 android() 和 ios{...} 平行)

    js {
        browser {     
        }
    }

为什么这花了我比预期更长的时间的陷阱:

遗忘的糟糕时光 .kts在 build.gradle.kts和奇妙的错误消息

因为jsApp build.gradle.kts现在是嵌套的，kotlin 插件不能有 version显然有(猜测它对一致性有意义)。

index.html中的js源文件名需要匹配模块名称(在我的例子中是 jsApp)。

别忘了include(":jsApp")在 settings.gradle.kts

推荐步骤:

尝试首先让“web”模块工作

使用基于 gradle 的运行配置

只有当web示例项目在新结构下工作时，才连接共享代码