Новый фасад Scala.js для Three.js -> "Не удается найти модуль" ТРИ ""

Поскольку https://github.com/antonkulaga/threejs-facade сильно устарел, я попробовал подход, подобный следующему: https://github.com/Katrix-/threejs-facade и хотел бы создать фасад для нового three.js библиотека.

Я ни в коем случае не JS эксперт, я тоже не Scala.js эксперт, так что скорее всего, я делаю что-то действительно глупое.

После другого вопроса я использую это sbt-scalajs-bundler а также sbt-web-scalajs-bundler

мой build.sbt выглядит так:

lazy val client = (project in file("modules/client"))
  .enablePlugins(ScalaJSBundlerPlugin, ScalaJSWeb) // ScalaJSBundlerPlugin automatically enables ScalaJSPlugin
  .settings(generalSettings: _*)
  .settings(
    name := "client"
    //, scalaJSModuleKind := ModuleKind.CommonJSModule // ScalaJSBundlerPlugin implicitly sets moduleKind to CommonJSModule enables ScalaJSPlugin
   ,jsDependencies += ProvidedJS / "three.min.js"
  )

lazy val server = (project in file("modules/server"))
  .enablePlugins(PlayScala, WebScalaJSBundlerPlugin)
  .settings(generalSettings: _*)
  .settings(
    name := "server"
    ,scalaJSProjects := Seq(client)
    ,pipelineStages in Assets := Seq(scalaJSPipeline)
    //,pipelineStages := Seq(digest, gzip)
    ,compile in Compile := ((compile in Compile) dependsOn scalaJSPipeline).value
  )

three.min.js находится в папке ресурсов моего client проект.

Например, одна часть фасада

@js.native
@JSImport("THREE", "Scene")
class Scene extends Object3D {

и я хочу использовать это так: val scene = new Scene, На scala.js сторона это на самом деле просто компилируется, но когда я запускаю ее, я получаю:

Ошибка: не удается найти модуль "ТРИ"

в браузере и мне интересно, почему. Это называется так в three.min.js в конце концов.

Теперь я попытался обеспечить и обслуживать three.min.js файл со стороны сервера, потому что я подумал, что, возможно, он просто отсутствовал во время выполнения, но нет, похоже, это не является причиной.

Так что теперь мне интересно, что я здесь делаю не так?

Просто чтобы уточнить: Остальное перевезено js работает просто отлично, если я не экспортирую использование Фасада!

1 ответ

Решение

Как объясняется в этой части документации Scala.js, @JSImport интерпретируется компилятором как импорт модуля JavaScript.

Когда вы используете CommonJSModule вид модуля (это тот случай, когда вы включаете ScalaJSBundlerPlugin), этот импорт переводится в следующий импорт CommonJS:

var Scene = require("THREE").Scene;

Эта аннотация только говорит о том, как ваш код Scala будет связан с миром JS, но ничего не говорит о том, как разрешить зависимость, которая обеспечивает THREE модуль.


С помощью scalajs-bundler вы можете определить, как разрешить JS-зависимости из реестра NPM, добавив следующий параметр в ваш client проект:

npmDependencies += "three" -> "0.84.0"

(И обратите внимание, что вы не можете использовать jsDependencies разрешить эти модули с @JSImport)

Также обратите внимание, что правильный импорт CommonJS для использования three.js "three" вместо "THREE", Так что ваши @JSImport аннотация должна выглядеть следующим образом:

@JSImport("three", "Scene")

В качестве альтернативы, если вы не хотите разрешать свои зависимости из реестра NPM, вы можете предоставить свой модуль CommonJS в виде файла ресурсов. Просто поместите это под src/main/resources/Scene.js и обратитесь к нему в @JSImport следующее:

@JSImport("./Scene", "Scene")

Вы можете увидеть рабочий пример здесь.

Другие вопросы по тегам