如何与Jsimport一起使用JQuery-UI

Question

我想访问我的Scala JS项目中的jQuery UI库。我尝试定义以下主模块：

import org.scalajs.jquery.JQueryStatic
import scala.scalajs.js
import org.scalajs.dom
import scalatags.JsDom.all._
import scala.scalajs.js.annotation.JSImport
@JSImport("jquery", JSImport.Namespace)
@js.native
object JQuery extends JQueryStatic
@js.native
trait JQueryUI extends JQueryStatic {
    def spinner(options: js.Object = js.Dynamic.literal()): JQueryUI = js.native
}
@JSImport("jquery-ui", JSImport.Namespace)
@js.native
object JQueryUI extends JQueryUI
object App {
    def main(args: Array[String]): Unit = {
        dom.document.getElementById("root").appendChild(div(input(id := "input")).render)
        JQuery("#input").asInstanceOf[JQueryUI].spinner()
    }
}

和我的build.sbt如下：

enablePlugins(ScalaJSBundlerPlugin)
lazy val opexCounter = project.in(file(".")).settings(
    name := "Repro",
    scalaVersion := "2.12.8",
    libraryDependencies ++= Seq(
        "org.scala-js" %%% "scalajs-dom" % "0.9.6",
        "com.lihaoyi" %%% "scalatags" % "0.6.7",
        "be.doeraene" %%% "scalajs-jquery" % "0.9.4"
    ),
    npmDependencies in Compile ++= Seq(
        "jquery" -> "2.2.1",
        "jquery-ui" -> "1.12.1",
    ),
    mainClass in Compile := Some("App"),
    scalaJSUseMainModuleInitializer := true,
    webpackDevServerPort := 3000
)

但是，当我加载页面时，我会在控制台中收到以下错误：

TypeError：Qual $ 1.Spinner不是函数

这不是导入库的正确方法，如果不是什么话？

可以在此处找到该项目的完整来源

Answer 1

我将我的npm依赖关系从 jquery-ui 更改为 jQuery-ui-bundle ，并导入它。我还必须对我的jQueryuiimport对象进行明确的引用，以确保其实例化。这2个更改解决了问题