Menu
I am reading this tutorial for ScalaJS
https://www.scala-js.org/tutorial/basic/
As you can see in my build.sbt, that I have included the reference to the jQuery library
enablePlugins(ScalaJSPlugin)
// This is an application with a main method
scalaJSUseMainModuleInitializer := true
name := "ScalaJSTest"
version := "1.0"
scalaVersion := "2.12.1"
libraryDependencies ++= Seq(
"org.scala-js" %%% "scalajs-dom" % "0.9.1",
"be.doeraene" %%% "scalajs-jquery" % "0.9.1"
)
jsDependencies += RuntimeDOM
skip in packageJSDependencies := false
jsDependencies +=
"org.webjars" % "jquery" % "2.1.4" / "2.1.4/jquery.js"
I have also included the jsDeps and the jquery library in my HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>The Scala.js Tutorial</title>
</head>
<body>
<!-- Include Scala.js compiled code -->
<script type="text/javascript" src="./target/scala-2.12/scalajstest-fastopt.js"></script>
<script type="text/javascript" src="./target/scala-2.12/scalajstest-jsdeps.js"></script>
</body>
</html>
I also did
npm install jsdom
This is my scalajs code
import scala.scalajs.js.JSApp
import org.scalajs.dom
import dom.document
import org.scalajs.jquery.jQuery
import scala.scalajs.js.annotation.JSExportTopLevel
object ScalaJsTest extends JSApp {
def main() : Unit = {
jQuery(() => setupUI())
}
def appendPar(node: dom.Node, text: String) : Unit = {
jQuery("body").append(s"<p>$text</p>")
}
@JSExportTopLevel("addClickedMessage")
def addClickedMessage(): Unit = {
appendPar(document.body, "You clicked the button!")
}
def setupUI(): Unit = {
jQuery("#click-me-button").click(() => addClickedMessage())
jQuery("body").append("<p>Hello World</p>")
}
}
But still my code gets the following error
Uncaught TypeError: (0 , $m_Lorg_scalajs_jquery_package$(...).jQuery$1) is not a function
at $c_LScalaJsTest$.appendPar__Lorg_scalajs_dom_raw_Node__T__V (scalajstest-fastopt.js:2341)
at $c_LScalaJsTest$.main__V (scalajstest-fastopt.js:2332)
at scalajstest-fastopt.js:6848
at scalajstest-fastopt.js:6849
551
You need to include the script tag with jsdeps before the one for fastopt.js. Otherwise, by the time your main method runs, jQuery has not been loaded yet.
134
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
