Electron应用中使用编译后Kotlin JS代码遇问题求解决方案

针对jsNodeProductionRun的模块找不到问题 #

• 调整Kotlin编译配置为UMD模块格式，适配Electron的混合环境：
  在项目的build.gradle.kts中修改JS目标配置：

  kotlin {
      js {
          nodejs() // 适配Electron/Node环境，指定nodejs目标
          binaries.executable()
          moduleKind.set(org.jetbrains.kotlin.gradle.targets.js.dsl.JsModuleKind.UMD)
          // 可选：指定输出目录，方便后续复制到Electron项目
          outputDirectory.set(file("build/js/electron-output"))
      }
  }
  

  执行gradlew jsNodeProductionBuild（注意用Build而非Run，Run是运行测试，Build才生成产物），将生成的build/js/electron-output/kotlin下所有文件复制到Electron项目后，使用import或require均可正确解析依赖。

• 检查Electron项目的模块类型：如果使用import语法（ES模块），需在Electron项目的package.json中添加"type": "module"，同时确保Kotlin生成的.js文件导入路径正确。若仍有路径问题，可直接将Kotlin生成的所有.js文件放在Electron项目的同一目录，避免跨目录相对路径解析异常。

针对jsBrowserDevelopmentWebpack打包后导出为空的问题 #

• 确认@JsExport使用正确：只有顶层函数/类或者伴生对象的成员可被@JsExport导出，且需保证函数为public（Kotlin默认public）。示例：

  @JsExport
  fun generateCrossword(data: CrosswordData): String {
      // 函数实现
  }
  

• 修改Webpack打包配置，确保导出正确：在Kotlin的build.gradle.kts中配置Webpack输出为UMD并指定全局变量名：

  kotlin {
      js {
          browser {
              binaries.executable()
              moduleKind.set(org.jetbrains.kotlin.gradle.targets.js.dsl.JsModuleKind.UMD)
              webpackTask {
                  output.library.set("kotwords")
                  output.libraryTarget.set("umd")
              }
          }
      }
  }
  

  执行gradlew jsBrowserProductionWebpack（用Production版本避免开发环境调试代码干扰），打包后的kotwords.js同时支持ES模块导入和全局变量：
  • 渲染进程可直接通过window.kotwords访问导出函数；
  • 主进程或ES模块环境，使用import * as kotwords from './kotwords.js'即可获取导出内容。

通用检查项 #

• 确保所有Kotlin依赖（如stdlib）被正确打包或复制：使用jsNodeProductionBuild时，需将kotlin-kotlin-stdlib-js-ir.js等依赖文件与kotwords.js放在同一目录，Electron才能正确解析相对路径。
• 清理Electron项目缓存：旧编译产物可能导致加载异常，删除Electron项目的node_modules/.cache或重启Electron即可。

内容的提问来源于stack exchange，提问作者jmm9