1

我一直在使用 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"
            }
        }
    }
}
4

1 回答 1

3

您应该使用模块名称和限定名称调用该函数：

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"
        }
    }
}

在这种情况下，您应该在文件夹中使用生成app.js的文件 ( ) web（您可以使用其他文件夹和文件名）。

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
于 2020-02-12T08:37:01.723 回答