Question

由于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项目的resources-folder中。

立面的一部分是例如

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

我希望像这样使用它：val scene = new Scene。在scala.js方面，这实际上编译得很好，但是当我运行它时，我得到：

错误：找不到模块“THREE”

浏览器中的

我想知道为什么。毕竟，它在three.min.js中被称为这样。

现在我也尝试从服务器端提供和提供three.min.js文件，因为我认为它可能只是在运行时丢失了，但是没有，这似乎不是原因。

所以现在我想知道我在这里做错了什么？

仅仅澄清：如果我不导出Facade的任何用法，其余的已编译js工作正常！

Answer 1

正如Scala.js文档的this part中所述，编译器将@JSImport解释为JavaScript模块导入。

当您使用CommonJSModule模块类型时（启用ScalaJSBundlerPlugin时就是这种情况），此导入将转换为以下CommonJS导入：

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

此注释仅说明您的Scala代码将如何与JS世界接口，但它没有说明如何解析提供THREE模块的依赖项。

使用scalajs-bundler，您可以通过将以下设置添加到client项目来定义how to resolve JS dependencies from the NPM registry：

npmDependencies += "three" -> "0.84.0"

（请注意，您无法使用jsDependencies使用@JSImport来解析这些模块。

另请注意，使用three.js的正确CommonJS导入为"three"而不是"THREE"，因此您的@JSImport注释应如下所示：

@JSImport("three", "Scene")

或者，如果您不想从NPM注册表中解析依赖项，则可以将CommonJS模块作为资源文件提供。只需将其放在src/main/resources/Scene.js下，然后在@JSImport中引用它，如下所示：

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

您可以看到一个有效的例子here。

Three.js的新Scala.js门面 - ＆gt; “找不到模块”三“”

1 个答案: