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

Question

我有一个 AndrodiStudio KMM 项目，我想添加一个 JS 目标。

鉴于 JS 开发只能在 IntelliJ 中使用，我希望我必须在 IDEA 中打开项目并添加一个“模块”——但我什至不知道该选择哪个——[=其中 56=] 似乎“合适”：

在 Gradle 部分，浏览器有“Kotlin/JS 和“Kotlin/JVM”。添加“Kotlin/JS”会中断* Gradle 为整个项目构建。“Kotlin/Multiplatform”听起来不像我想要的，因为我已经有了“共享”模块（尽管它不包括 JS）
在 Kotlin 部分，有“KS | IDEA”。显然，我不想将基于“IDEA 构建系统”的东西添加到基于 gradle.kts 的项目中。

所以我的问题是：

哪个模块模板是添加“jsApp”（或 webApp）以及“iosApp”和“androidApp”（在 AndroidStudio 或 Idea 中？）的最佳起点？
我需要添加什么到“shared/build.gradle.kts”以支持“jsMain”和“jsTest”文件夹？是否有不同/更好的起点（例如 Github 上涵盖所有平台的教程或最小“helloWorld”示例）？

我的代码的当前结构对应 1:1 Android Studio 中的 KMM 项目模板：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 项目并将其复制到 KMM 项目中的 jsApp 使其工作（与 iosApp 等并行）最小值 jsApp/build.gradle.kts似乎是：

plugins {
    kotlin("js")
}

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

kotlin {
    js() {
        browser {
        }
    }
}

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

平行

    js {
        browser {     
        }
    }

我花了比预期更长的时间的陷阱：

在 build.gradle.kts 中忘记 .kts 和奇妙的错误消息
因为 jsApp build.gradle.kts 现在是嵌套的，所以 kotlin 插件显然不能有 version（猜测这对一致性有意义）。
index.html 中的 js 源文件名需要与模块名称匹配（jsApp 在我的例子中）。
不要忘记include(":jsApp")在settings.gradle.kts

推荐步骤：

首先尝试让“网络”模块正常工作
使用基于 gradle 的运行配置
只有当web示例项目在新结构下运行时，才连接共享代码

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

How do I add a JS target to a KMM project?

intellij-idea

android-studio

kotlin-multiplatform

kotlin-js