Как использовать scalajs-bundler с клиентским приложением

Question

В другом вопросе мне посоветовали использовать пакет ScalaJS для импорта зависимостей NPM.

Я хотел бы использовать некоторые пакеты Javascript NPM в простом клиентском веб-приложении. Есть пример, который называется статическим, который показывает это. Мои изменения в примере:

Добавьте в build.sbt:

npmDependencies in Compile += "esprima" -> "3.1.3"

Добавьте в Main.scala:

import Esprima._
import JsonToString._
val code = "answer = 42"
val tokens = tokenize(code)
val tokensStr = tokens.json

Изменить в Main.scala: "This is bold" в s"This is bold $tokensStr"

Фасад (немного упрощенный, для полной версии смотрите GitHub):

import scala.scalajs.js
import scala.scalajs.js.annotation.JSName

@JSName("esprima")
@js.native
object Esprima extends js.Object {

  def tokenize(input: String, config: js.Any = js.native, delegate: String => String = js.native): js.Array[js.Any] = js.native

  def parse(input: String, config: js.Any = js.native): js.Dynamic = js.native
}

При запуске HTML, созданный с fastOptJS::webpack ошибка:

Uncaught TypeError: Невозможно прочитать свойство 'tokenize' из неопределенного

Осматривая static-fastopt-bundle.js шоу esprima используется, но его JS не в комплекте.

Какие еще шаги необходимы для добавления зависимостей в веб-страницу только для клиента?

Answer 1

Как описано в этой части документации, вы должны использовать @JSImport в вашем определении фасада:

@JSImport("esprima", JSImport.Namespace)

Для справки, @JSName определяет фасад, связанный с глобальным именем, в то время как @JSImport определяет фасад, связанный с requireМодуль JavaScript.