如何从常规 Javascript 调用 Kotlin/JS 函数？

Question

我一直在使用 Kotlin 开发一个小型 2D 模拟软件，我正在使用 Kotlin 多平台项目在 JVM 和浏览器中实现它运行。到目前为止效果很好。

但是，当我想从常规 Javascript.

调用 Kotlin/JS 中定义的函数时遇到问题

为了让我的应用程序在浏览器中运行，我在运行构建“build”Gradle 之后包含了“build/distributions”文件夹下的大 JS 文件任务。当我的 Kotlin/JS 应用程序包含 main() 函数时，当打开引用 JS 文件的 HTML 页面时会自动调用该函数，并且运行良好.

但是如果我删除主函数，而是创建一个 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

In some cases (for example, to support overloads), Kotlin compiler mangles names of generated functions and attributes in JavaScript code. To control the generated names, you can use the @JsName annotation

更新：您有两种更改模块名称的方法：

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

配置库模式的内容

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

如何从常规 Javascript 调用 Kotlin/JS 函数？

How to call Kotlin/JS functions from regular Javascript?

javascript

gradle

kotlin

kotlin-js