如何從常規 Javascript 調用 Kotlin/JS 函數？

Question

我一直在使用 Kotlin 開發一個小型 2D 模擬軟件，並且我正在使用 Kotlin 多平台項目使其在 JVM 和瀏覽器中運行。 到目前為止，它運行良好。

但是，當我想從常規 Javascript 調用 Kotlin/JS 中定義的函數時，我遇到了問題。

為了讓我的應用程序在瀏覽器中工作，我在運行“build”Gradle 任務后包含了“build/distributions”文件夾下的大 JS 文件。 當我的 Kotlin/JS 應用程序包含main()函數時，當打開引用 JS 文件的 HTML 頁時會自動調用這個函數，並且它運行良好。

但是，如果我刪除 main 函數，而是創建一個應該手動調用的start()函數（例如，在單擊按鈕后），它就不起作用：它說函數start()未定義即使它是在 Kotlin 代碼中聲明的。

打開生成的 JS 文件后，似乎確實沒有start()函數。 看起來所有函數的名稱都被縮小了。

我嘗試添加@JsName ，但它沒有改變任何東西。

所以我想我做錯了什么，但我真的不知道是什么以及如何使它起作用。

注意：我使用的是 Kotlin 1.3.70

編輯：這是我的 build.gradle.kts 的核心：

plugins {
    kotlin("js") version "1.3.70-eap-184"
}


repositories {
    mavenLocal()
    mavenCentral()

    maven(url = "https://dl.bintray.com/kotlin/kotlin-eap")
}

dependencies {

}

kotlin {
    target {
        nodejs {

        }
        browser {
            webpackTask {
                mode = org.jetbrains.kotlin.gradle.targets.js.webpack.KotlinWebpackConfig.Mode.PRODUCTION
                bin = "$projectDir/node_modules/$bin"
            }
        }
    }
}

Answer 1

您應該使用模塊名稱和限定名稱調用該函數：

https://kotlinlang.org/docs/reference/js-to-kotlin-interop.html#package-structure

package my.qualified.packagename

fun foo() = "Hello"

alert(myModule.my.qualified.packagename.foo());

https://kotlinlang.org/docs/reference/js-to-kotlin-interop.html#jsname-annotation

在某些情況下（例如，為了支持重載），Kotlin 編譯器會修改 JavaScript 代碼中生成的函數和屬性的名稱。 要控制生成的名稱，您可以使用@JsName注釋

UPD：您有兩種方法可以更改模塊名稱：

1) 如果您使用 gradle，則可以將此代碼添加到build.gradle

compileKotlinJs {
    kotlinOptions.outputFile = "${rootDir}/web/app.js" // should be valid js variable name
}

或者在你的build.gradle.kts

kotlin {
    target {
        compilations.all {
            kotlinOptions.outputFile = "${rootDir}/web/app.js"
        }
    }
}

在這種情況下，您應該在web文件夾中使用生成的文件 ( app.js )（您可以使用其他文件夾和文件名）。

2）你應該創建文件夾webpack.config.d並創建任意名稱的 js 文件，以及為webpack配置庫模式的webpack

config.output = config.output || {} // just in case where config.output is undefined
config.output.library = "libraryName" // should be valid js variable name