1

由于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：如果我不导出任何 Facade 的使用，其余的转译作品就好了！

4

1 回答 1

1

正如Scala.js 文档的这一部分@JSImport所解释的，编译器将其解释为 JavaScript 模块导入。

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

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

这个注解只说明了你的 Scala 代码将如何与 JS 世界交互，但它没有说明如何解决提供THREE模块的依赖项。

使用 scalajs-bundler，您可以通过将以下设置添加到项目中来定义如何从 NPM 注册表解析 JS 依赖项client：

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")

您可以在此处查看一个工作示例。

于 2017-01-29T23:30:33.720 回答